fc2ブログ
 当サイトテンプレートには、カテゴリバーが付いているものが多いです。
 しかし、このカテゴリバー実は結構なくせ者で、カテゴリを多く作っている方の場合は、カテゴリバーが崩れてしまいます。
 そのときの対処策をいくつか紹介します。


カテゴリバーを外してしまう

 いっそのこと、カテゴリバー自体を無くしてしまえという場合は、

<!--カテゴリバー-->

 と言う項目がテンプレートHTML編集の画面、比較的上の方に記述されています。
 だいたいは以下の2種類の書き方をしています。

(1)
<!--カテゴリバー-->
<div id="navigation">
<div class="cate_bar">
<!--category-->
<div class="cate_bar_float">
<a href="<%category_link>" title="<%category_name> (<%category_count>)"><%category_name></a>
</div>
<!--/category-->
</div><br clear="all"/>
</div>

(2)
<!--カテゴリバー-->
<div id="navigation">
<table class="cate_bar"><tr>
<!--category-->
<td class="cate_bar_float">
<a href="<%category_link>" title="<%category_name> (<%category_count>)"><%category_name></a>
<!--/category-->
</table>
</div>

(3)
<!--カテゴリバー-->
<div id="navigation">
<!--category-->
<!--category_parent--><span class="cate_oya"><!--/category_parent-->
<!--category_sub_begin--><div class="cate_sub"><!--/category_sub_begin-->
<a href="<%category_link>" title="<%category_name>" class="cate_links"><%category_name></a>
<!--category_sub_end--></div><!--/category_sub_end-->
<!--category_parent--></span><!--/category_parent-->
<!--category_parent--><span class="cate_oya_button">▼</span><!--/category_parent-->
<!--/category-->
</div>

 この一文を消せば、カテゴリバー自体をなくすことが出来ます。
 一番易しい方法がこれです。

:必ずテンプレートのコピーを予めしておいて、正常に表示されなくなった場合に備えておいてください。


専用のナビバーにする

 これは、ハイパーリンクのタグが自分で書ける人限定です。
 先ほど示した2種類のカテゴリバーの説明をします。


(1)のHTMLの場合

 これは、「divフロート」を利用したリンクです。
 この場合は以下のように書き換えます。

(1)
<!--カテゴリバー-->
<div id="navigation">
<div class="cate_bar">
<!--category-->
<div class="cate_bar_float">
<a href="<%category_link>" title="<%category_name> (<%category_count>)"><%category_name></a>
</div>
<!--/category-->
</div><br clear="all"/>
</div>

(1)
<!--カテゴリバー-->
<div id="navigation">
<div class="cate_bar">

<div class="cate_bar_float">
<a href="http://~~~.html">オリジナルのリンク1</a>
</div>

<div class="cate_bar_float">
<a href="http://~~~.html">オリジナルのリンク2</a>
</div>

<div class="cate_bar_float">
<a href="http://~~~.html">オリジナルのリンク3</a>
</div>

       :
       :

</div><br clear="all"/>
</div>


 このように「<div class="cate_bar_float">~</div>」をセットにして、作りたい数だけリンクを作ります。



(2)のHTMLの場合

 (2)はテーブルを利用したカテゴリバーです。

(2)
<!--カテゴリバー-->
<div id="navigation">
<table class="cate_bar"><tr>
<!--category-->
<td class="cate_bar_float">
<a href="<%category_link>" title="<%category_name> (<%category_count>)"><%category_name></a>
<!--/category-->
</table>
</div>

(2)
<!--カテゴリバー-->
<div id="navigation">
<table class="cate_bar"><tr>

<td class="cate_bar_float">
<a href="http://~~~.html">オリジナルのリンク1</a>

<td class="cate_bar_float">
<a href="http://~~~.html">オリジナルのリンク2</a>

<td class="cate_bar_float">
<a href="http://~~~.html">オリジナルのリンク3</a>

       :
       :

</table>
</div>

 こちらの場合は「<td class="cate_bar_float">」+「オリジナルのリンクタグ」をセットで、好きな数だけ増やします。



(3)のHTMLの場合

(3)
<!--カテゴリバー-->
<div id="navigation">
<!--category-->
<!--category_parent--><span class="cate_oya"><!--/category_parent-->
<!--category_sub_begin--><div class="cate_sub"><!--/category_sub_begin-->
<a href="<%category_link>" title="<%category_name>" class="cate_links"><%category_name></a>
<!--category_sub_end--></div><!--/category_sub_end-->

<!--category_parent--></span><!--/category_parent-->
<!--category_parent--><span class="cate_oya_button">▼</span><!--/category_parent-->
<!--/category-->

</div>

(3)
<!--カテゴリバー-->
<div id="navigation">

<span class="cate_oya">
<a href="http://~~~.html">オリジナルのリンク1</a>
</span>

<span class="cate_oya">
<a href="http://~~~.html">オリジナルのリンク2</a>
</span>

<span class="cate_oya">
<a href="http://~~~.html">オリジナルのリンク3</a>
</span>

</div>




*入れるものと言えば、トップページへのリンクや、プロフィールサイト、重要なメニューページへのリンクなどがオードソックスだと思います。
 ちなみに、当サイトではメニューページを「記事」ページで書いておき、そこのページへのリンクを設置しています。

 説明不足だとは思いますが…不明点は、コメント欄の方へお願いします。
このエントリーをはてなブックマークに追加
Mon.07.12.2010
Comment
223
承認待ちコメント
このコメントは管理者の承認待ちです

Trackback
Comment Form
質問するときは?
  • 不具合が出ているページのURLを書き込む。
  • 使っているブラウザ(IE、Firefoxなど)を書き込む※IE6はサポート外です。
  • 次の人が確認できるように、使っているテンプレートの記事ページ、或いは各カスタマイズ記事ページにコメントを書きこむ。
コメント時の注意
やっぱり自分で解決したい時
特定の記事のみでレイアウトが崩れる場合
全ページでレイアウトが崩れる場合
メールフォーム
Bookmarks
Page Top
Copyright © SAKILab All Rights Reserved.