Home > FC2ブログ > basic_white > basic_whiteテンプレート メイン記事とページナビの間にバナーなどを設置

basic_whiteテンプレート メイン記事とページナビの間にバナーなどを設置

 basic_whiteテンプレートのトップページで記事とページナビの間にバナー・広告などのコンテンツを設置する方法です。

 エリア変数を削除すれば個別ページなど全ページに表示することができます。

1. HTML

 場所はCtrl+Fキーで『/search_area』を検索。以下の強調部分を追加します。

</div><!--/search-->
<!--/search_area-->

<!--not_permanent_area--><div id="main-footer">

ここにバナーなどのコンテンツを入れる

</div><!--/not_permanent_area-->


<!--permanent_area-->
<div class="page_navi">

2. スタイルシート

 スタイルシートに以下のコードを追加します。

 以上で完成です。

個別ページでもコンテンツを表示させる

 [1]で追加したHTMLの「<!--not_permanent_area-->」と「<!--/not_permanent_area-->」を削除して次のようにしてください。

</div><!--/search-->
<!--/search_area-->

<div id="main-footer">

ここにバナーなどのコンテンツを入れる

</div>

<!--permanent_area-->
<div class="page_navi">

コンテンツ内のテキストや画像のセンタリングなど

 [2]で追加したコードに「text-align: center;」を加えると中央寄せになります。※設置するコンテンツによってはならない場合もあります。

font-size: 90%;
text-align: center;

 文字色を変更する時は以下を追加。色は「#008800」の部分で変更。

font-size: 90%;
color: #008800;

 リンクに下線を引く時は以下の強調部分を追加。

}
#main-footer a {text-decoration: underline;}
/* END */

 文字サイズを変更する時は「90%」の数値を増減させて調整してください。

関連記事
スポンサー リンク
コメント
#215 : 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
#216 : No title
ここのサイトのように上にあるグローバルナビメニューを設置したいのですが
どうすればよいのでしょうか?
#217 : サムネイル画像について
こちらから失礼致します。
サムネイル画像なのですが、表示される記事と表示されない記事があります。
表示されるには記事内で条件などがあるのでしょうか?
一番最初の画像をサムネイルで表示させたいのですが、
ご指導いただけましたら嬉しいです。
お手数をお掛け致しますがどうぞ宜しくお願い致します。
#218 : #217 Re: サムネイル画像について
コンバンハ。
リンク先の基本的なデザインのカスタマイズ・変更のコメント返信でも回答済みですが、このテンプレートで使用されているサムネイル画像は「記事本文部分(追記部分の画像は対象外)に投稿されたFC2ブログにアップロードした画像」が対象となります。
ですので記事本文部分に画像がない場合やFC2ブログ以外にアップロードされた画像はサムネイルとしては表示されません。
これは仕様ですので機能のバージョンアップなどを希望される場合はFC2側にリクエストを出すと実装されるかもしれません。
http://request.fc2.com/index.php?ct1=5

なお、こちらの記事で受け付けているコメントは『メイン記事とページナビの間にバナーなどを設置する方法』に関連する事項になります。ご了承くださいませ。
#223 : Re: ヘッダー内の記事一覧のタグをカテゴリーのように並べる
#215
コンバンハ。
解釈が間違っていたら申し訳ございません。
ヘッダーにある「記事一覧」の横にリンクを並べるということでしょうか?
その場合は以下のような形式でリンクを追加していくと横に並びます。
<p class="archives"><a href="<%url>archives.html">記事一覧</a></p>
<p class="archives"><a href="URL">リンク名1</a></p>
<p class="archives"><a href="URL">リンク名2</a></p>

ただしこの方法は背景画像の関係で大きな横幅のリンクは作成できません。
任意の横幅でリンクを追加する場合はリンク先URLの記事をご参考くださいませ。
ヘッダのメニューリンクに関するコメントの場合はリンク先にて頂けると助かります。

コメントの投稿

  

※コメントは記事と直接関連のある事柄のみ受け付けています。

カテゴリ
月別アーカイブ
最新記事
Comments
<>+-
プロフィール

Author:may
 不具合のないように心掛けておりますが、カスタマイズの方法などは自己責任でご利用ください。テンプレートを大きく変更する際は複製してバックアップを用意することを推奨します。

 ご自身のブログをカスタマイズする分には問題ありませんが、記事内容や配布コードの転載・再配布はご遠慮ください。

 過度のご質問・要望については返信や対応が遅れることがございます。返信のない場合は保留・棚上げとなりますが、記事の題材がなくなり、時間にそれなりのゆとりが生じた時に対応する予定です。

Galleryサンプル
ヨッシー New アイランド
The Last of Us Remastered