FC2ブログ

スポンサーサイト

大事なお知らせ FC2ブログ非公開変数の領域変更により、一部ページナビが表示されない等 テンプレートに不具合が出ております。ユーザーの皆さまにはご迷惑をおかけして恐縮ですが、 2012.11.10.以前にDLしたテンプレートをご利用の場合は、一旦テンプレートを削除、もしくは名前を変更した上で、再DLして御利用くださいますようお願い申し上げます。詳しくは不具合解消のための再DLのお願い
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


Yahoo!ブックマークに登録 このエントリーをはてなブックマークに追加 Buzzurlにブックマーク
【漫画メインページの記事欄に作品(カテゴリ)別にバナーを貼る】へ  【漫画メインページの左フレームにバナーを貼る】へ

通常ブログ画面・検索・アーカイブページで作品(カテゴリ)別にバナーを貼る

大事なお知らせ FC2ブログ非公開変数の領域変更により、一部ページナビが表示されない等 テンプレートに不具合が出ております。ユーザーの皆さまにはご迷惑をおかけして恐縮ですが、 2012.11.10.以前にDLしたテンプレートをご利用の場合は、一旦テンプレートを削除、もしくは名前を変更した上で、再DLして御利用くださいますようお願い申し上げます。詳しくは不具合解消のための再DLのお願い
  • 【漫画メインページの記事欄に作品(カテゴリ)別にバナーを貼る】へ
  • 【漫画メインページの左フレームにバナーを貼る】へ
前ページでは、漫画メインページ(個別記事・カテゴリページ)で、作品(カテゴリ)ごとに違うランキングバナーを表示させるカスタマイズを御紹介しましたが、同じことが一般ブログスタイルで表示されるエリア(通常ブログ画面・検索・アーカイブ)ページでもできます。

個々の作品別にジャンルの違うランキングに参加する場合に便利なカスタマイズです。

カテゴリの番号の確認


テンプレートをカスタマイズする前に、表示させるカテゴリの番号を確認しておきます。
カテゴリ番号は[カテゴリの編集]画面のカテゴリ一覧リストの一番左、# をクリックすると表示される番号がそれですが、目次ページのアドレスからも確認できます。
http://comictemplate.blog.fc2.com/blog-category-〇〇.html
〇〇がそのカテゴリのカテゴリ番号です。
  • 【漫画メインページの記事欄に作品(カテゴリ)別にバナーを貼る】へ
  • 【漫画メインページの左フレームにバナーを貼る】へ

カスタマイズ


[菅理画面]⇒[環境設定]⇒【テンプレートの設定】をクリックして
テンプレートの管理]ページを開く


PCテンプレート [ テンプレート名 ] 適用中
[ テンプレート名 ] のテンプレート名変更
テンプレート名 のHTML編集
テンプレート名 のスタイルシート編集         こんなふうに上から順番に並んでいます。

HTML編集]部分をカスタマイズします。

<head> ~ </head> 部分のカスタマイズ


<style type="text/css"><!--
~ 

--></style> 内に
XXカテゴリ番号に変更して追加します。

.cnXX_XX { display: block ; }


 記述の注意!
スタイルシートに追加する際、クラス名の前のドット を忘れたり、、逆に、記載内容のどこかに全角スペースが入ってしまうとカスタマイズした内容がテンプレートに反映されなくなります。コロン:セミコロン;も間違えやすいので、ご注意ください!
.cn1_1 { display : block ;}
同じスペースでも、半角スペースなら問題ないのですが、全角スペースが記載内容のどこかに入ってしまうと カスタマイズした内容がテンプレートに反映されません。
 .cn1_1 { display : block ; }

複数のカテゴリ番号の記事欄で表示する場合はセレクタとセレクトの間にカンマ入れて列挙します。
以下はカテゴリ番号1とカテゴリ番号2の記事欄にバナー等を表示する例

.cn1_1 ,.cn2_2 { display : block ; }


<body> ~ </body> 部分のカスタマイズ


Comicテンプレートには予め、ランキングバナーなどを追加する個所が指定してあります。
キーボードの  Ctrl  +  F  をクリックすると、画面の上もしく下に検索ボックスが表示されますので、
そこに <!--more--><!--/more--> と入れて以下の個所を探します。

<!--//////(個別記事以外で)ブログ拍手の上にランキングバナー等を表示する場合はココ////
個別記事ではどこに貼っても記事とブログ拍手ボタンの間に割り込んで表示させることはできません//-->


<!--more--><!--/more-->

<!--//////ブログ拍手・広告の下にランキングバナー等を表示する場合はココ////-->

<!-- (a2)カテゴリ別に違うバナーを貼る場合
<!--not_page_area--><!--not_date_area--><!--not_search_area-->
<div class="c cnXX">
      //////////////////////////////////////////
XXをカテゴリ番号に変更し(a1)と(b1)の行を削除するとここに記入した内容は
漫画メインページでそのカテゴリのページにだけ表示されます
漫画メインページ以外でカテゴリ別のバナーを貼る場合は作者ブログ解説記事をご参照ください。
//////////////////////////////////////
</div>
<!--/not_search_area--><!--/not_date_area--><!--/not_page_area-->
(b2)この行と(a2)の行を削除-->



<!--more--><!--/more-->赤色の部分にバナーを貼れば、
ブログ拍手ボタン・ツィッターなど管理画面で設定する自動設定のボタンの上に表示され、

<!--more--><!--/more-->青色の部分に貼れば、
自動設定のボタンとアカマイ広告より下の記事欄下部に表示されます。


XX をカテゴリ番号に変更して上の赤色の部分と差し替えます。

<!--not_permanent_area--><!--not_category_area-->
<div class="c cnXX_<%topentry_category_no> ad<%topentry_no>"><a href="リンク先アドレス" target="_blank" title=""><img src="バナー画像アドレス" alt="" border="0" width="幅" height="高さ" /></a>
</div>
<!--/not_category_area--><!--/not_permanent_area-->



▼以下はカテゴリ番号2の記事欄にバナーを表示させる場合の例

<!--not_permanent_area--><!--not_category_area-->
<div class="c cn2_<%topentry_category_no> ad<%topentry_no>">
<a href="リンク先アドレス" target="_blank" title=""><img src="バナー画像アドレス" alt="" border="0" width="幅" height="高さ" /></a>
</div>
<!--/not_category_area--><!--/not_permanent_area-->


 記述の注意!
この時クラス名の前にドットは不要ですが、複数のクラス名で指定しているので、クラス名とクラス名の間の半角スペースをお忘れなく!
<div class="c cn2_<%topentry_category_no> ad<%topentry_no>">

親カテゴリで指定する場合は、
cnカテゴリ番号_<%topentry_category_no> を
cn親カテゴリ番号_<!--parent_category--><%topentry_parent_category_no><!--/parent_category--> に変更します

▼以下は親カテゴリ番号1の全ての子カテゴリの記事欄にバナーを表示させる場合の例

<!--not_permanent_area--><!--not_category_area-->
<div class="c cn1_<!--parent_category--><%topentry_parent_category_no><!--/parent_category--> ad<%topentry_no>">
<a href="リンク先アドレス" target="_blank" title=""><img src="バナー画像アドレス" alt="" border="0" width="幅" height="高さ" /></a></div>


<!--/not_category_area--><!--/not_permanent_area-->


複数のカテゴリに同じバナーを表示する場合は 二番目のクラス名 cnカテゴリ番号 の後ろに半角スペースを空けて、第三のクラス名として cnカテゴリ番号_<%topentry_category_no> と列挙していきます。

▼以下はカテゴリ番号2,4,6 のカテゴリの記事欄に同じランキングバナーを表示する場合の例

<!--not_permanent_area--><!--not_category_area-->
<div class="c cn2_<%topentry_category_no> cn4_<%topentry_category_no> cn6_<%topentry_category_no> ad<%topentry_no>">
<a href="リンク先アドレス" target="_blank" title=""><img src="バナー画像アドレス" alt="" border="0" width="幅" height="高さ" /></a></div>
<!--/not_category_area--><!--/not_permanent_area-->



▼以下はカテゴリ番号2,4,6 で別々のバナーを表示させる場合の例

<!--not_permanent_area--><!--not_category_area-->
<div class="c cn2_<%topentry_category_no> ad<%topentry_no>">
<a href="リンク先アドレス" target="_blank" title=""><img src="バナー画像アドレス" alt="" border="0" width="幅" height="高さ" /></a></div>
<div class="c cn4_<%topentry_category_no> ad<%topentry_no>">
<a href="リンク先アドレス" target="_blank" title=""><img src="バナー画像アドレス" alt="" border="0" width="幅" height="高さ" /></a></div>
<div class="c cn6_<%topentry_category_no> ad<%topentry_no>">
<a href="リンク先アドレス" target="_blank" title=""><img src="バナー画像アドレス" alt="" border="0" width="幅" height="高さ" /></a></div>

<!--/not_category_area--><!--/not_permanent_area-->





更新 】 をクリックする。


関連記事
スポンサーサイト

Yahoo!ブックマークに登録 このエントリーをはてなブックマークに追加 Buzzurlにブックマーク
【漫画メインページの記事欄に作品(カテゴリ)別にバナーを貼る】へ  【漫画メインページの左フレームにバナーを貼る】へ

~ Comment ~

管理者のみ表示。 | 非公開コメント投稿可能です。

~ Trackback ~

トラックバックURL


この記事にトラックバックする(FC2ブログユーザー)

【漫画メインページの記事欄に作品(カテゴリ)別にバナーを貼る】へ  【漫画メインページの左フレームにバナーを貼る】へ

WEB漫画(マンガ)専用
Comicテンプレート

風の王国[展示漫画]

全27ページ
  3kaku_s_L.png 初めから読む

カスタマイズ

⇒ もくじ

Home
Comic
SiteMap
『風の王国』 公開サイト▼
展示漫画 『風の王国』の続きは 歌門様 の本家サイト【空色かんづめ】でご覧になれます
掲載漫画,イラストは歌門さつき様からお借りしました。
banner.jpg
管理人の本館▼
banner.jpg
翻訳の底本:Beatrix Potter "The Tale of Peter Rabbit" (1902)
上記の翻訳底本は、著作権が失効しています。
出典:青空文庫
翻訳者:大久保ゆう
※この翻訳は「クリエイティブ・コモンズ 表示 2.1 日本 ライセンス」によって公開されています。

画像をクリックしても次ページは開きません。ページ移動は画面上下右のナビボタンで

カスタマイズ

 もくじ

⇒ もくじ

キーボードの  F11  を
クリックすると全画面で
表示されます。二回押すと元に戻ります。

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。