Home > FC2ブログ > basic_white > basic_whiteテンプレート 個別記事下にブログ内のユーザータグリンク設置

basic_whiteテンプレート 個別記事下にブログ内のユーザータグリンク設置

 basic_whiteテンプレートはユーザータグが表示されません。これを個別記事に表示させる方法です。

 設置方法はいずれか一つを選択してください。例えば「記事下」から「記事フッター内」に変更する時は「記事下」のHTMLとスタイルシートを削除して「記事フッター内」のコードを追加します。

記事下に設置

1:HTML

 場所はCtrl+Fキーで『topentry_more』を検索。「<!--/more-->」の直後に以下のコードを追加します。

<!--more--><div class="more"><%topentry_more></div><!--/more-->

<!--topentry_tag--><ul class="entry_tag"><!--tag_list-->
<li><a href="./?tag=<%topentry_tag_list_parsename>"><%topentry_tag_list_name></a></li>
<!--/tag_list--></ul><!--/topentry_tag-->

2:スタイルシート

 スタイルシートに以下のコードを追加してください。

 以上で完成です。


記事フッター内に設置

1:HTML

 場所はCtrl+Fキーで『entry_footer"』を検索。「<div class="entry_footer">」の直後に以下のコードを追加します。

<div class="entry_footer">

<!--topentry_tag--><ul class="entry_tag"><!--tag_list-->
<li><a href="./?tag=<%topentry_tag_list_parsename>"><%topentry_tag_list_name></a></li>
<!--/tag_list--></ul><!--/topentry_tag-->

2:スタイルシート

 スタイルシートに以下のコードを追加してください。

 以上で完成です。


記事フッター左側に設置

 指定するユーザータグの数が少ない場合やテーマのスレッドを利用しない場合は1行で収まります。

1:HTML

 場所はCtrl+Fキーで『entry_footer"』を検索。「<div class="entry_footer">」内を次のように変更します。

<div class="entry_footer">

<!--topentry_tag--><ul class="entry_tag"><!--tag_list-->
  <li><a href="./?tag=<%topentry_tag_list_parsename>"><%topentry_tag_list_name></a></li>
<!--/tag_list--></ul><!--/topentry_tag-->

<ul class="entry_state">
  <li>カテゴリ:<a href="<%topentry_category_link>" title="<%template_view_category>"><%topentry_category></a></li>
<!--allow_comment-->
  <li><a href="<%topentry_link>#cm" title="<%template_post_comment>">CM:<%topentry_comment_num></a></li>
<!--/allow_comment--><!--deny_comment--><!--/deny_comment-->
<!--allow_tb-->
  <li><a href="<%topentry_link>#tb" title="<%template_trackback>">TB:<%topentry_tb_num></a></li>
<!--/allow_tb--><!--deny_tb--><!--/deny_tb-->
</ul>

<!--community--><ul class="entry_community">
  <li><%template_genre>:<a href="<%topentry_community_janrelink>" title="<%topentry_community_janrename>"><%topentry_community_janrename></a></li>
  <li><%template_theme>:<a href="<%topentry_thread_link>" title="<%topentry_thread_title>"><%topentry_thread_title></a></li>
</ul><!--/community-->

</div>

2:スタイルシート

 スタイルシートに以下のコードを追加してください。

 以上で完成です。


タグの横幅を調整する

 スタイルシートの「width: 50%」の数値を変更します。タグ(tag)を60%、右側のカテゴリ(state)を40%のようににすればタグを表示できる横幅が広がります。数値は両方合わせて100%になるように調整してください。

#main_contents .entry_footer .entry_state {margin: 0; width: 40%;}

.p_area .entry_tag {float: left; margin: 0; width: 60%; font-size: 83%;}

ユーザータグの文字色・背景色を変更

 追加したスタイルシートの次の3ヶ所を変更します。backgroundが背景色、colorが文字色、:hoverの後にあるbackgroundがカーソルが重なった時の背景色です。

スタイルシート

#main_contents .p_area .entry_tag a {
  white-space: nowrap; display: inline-block; padding: 2px 3px;
   background: #bbbbbb; color: #ffffff;
}
#main_contents .p_area .entry_tag a:hover {background: #333333;}

 次のようにすると色が濃く(デフォルトの逆…カーソルを合わせると薄く)なります。

#main_contents .p_area .entry_tag a {
  white-space: nowrap; display: inline-block; padding: 2px 3px;
   background: #333333; color: #ffffff;
}
#main_contents .p_area .entry_tag a:hover {background: #bbbbbb;}

関連記事
スポンサー リンク
コメント
#108 : No title
こちらのページのおかげで本当にbasic_whiteのカスタマイズが
楽しくなって本当にうれしいです!!

ここしか頼るところがないので色々教えてください。




強制的に続きを読むになる設定をはずして
追記で 続きを読むにしています。

その際に 続きを読むが関連記事より  ”下”に表示されてしまいます。
これを 関連記事よりすぐ上に表示したいのと


アドンセンスなどの広告も関連記事より下に表示されてて
すぐ上に表示できたらなと思います。

たくさんごめんなさい。

#109 : 関連記事の表示位置
コンバンハ。
URL先に関連記事を指定した場所に表示する方法を掲載いたしましたのでご参考ください。
続きを読む?の後に貼り付ければ問題無いかと思います。
不具合がございましたらURL先にてお願いいたします。
#121 : No title
タグをトップページの記事に表示する場合をおしえてほしいです!
#136 : タグをトップページに
コンバンハ。
URLリンク先に設置方法の記事を投稿したのでご参考ください。

basic_whiteは構造が複雑なので具体的な設置場所などを指定していただけると助かります。
意図や希望が異なるとコードを作り直す必要があり、時間がかかる場合がございます。
ご了承くださいませ。

コメントの投稿

  

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

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

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

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

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

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