「パンくずリスト」を設置すると、訪問者がブログ内で迷わないよう

道しるべの役目をしてくれます。

「パンくずリスト」は私のブログでは、記事の上に表示されている部分です。

FC2-85.jpg

私のテンプレートには設置されていませんでしたが

元々設置されているテンプレートもあるようです。

パンくずリストを設置する場合は、管理画面左の「環境設定」→「テンプレートの設定」から編集します。

失敗したら大変なので、テンプレートの複製(コピー)を忘れずにしておきましょう!

「HTMLの編集」に以下のタグを挿入して下さい。

<!-- パンくずリスト -->
<!--not_index_area-->
<div class="pankuzu">
<!--permanent_area-->
<!--topentry-->
<a href="<%url>" title="TOPページへ">TOP</a> > <a href="<%topentry_category_link>"><%topentry_category></a> > title - <%sub_title>
<!--/topentry-->
<!--/permanent_area-->
<!--category_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > CATEGORY - <%sub_title>
<!--/category_area-->
<!--search_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > SEARCH - <%sub_title> の検索結果
<form action="./" method="get"><input type="text" size="20" name="q" value="" maxlength="200" class="ipt" /> <input type="submit" value="Search" class="search" /></form>
<!--/search_area-->
<!--date_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > ARCHIVE - <%now_year>年<%now_month>月
<!--/date_area-->
<!--edit_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > edit - 修正画面
<!--/edit_area-->
<!--tag_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > <%tag_word>
<!--/tag_area-->
</div>
<!--/not_index_area-->
<!-- パンくずリスト ここまで-->

挿入する場所は、「パンくずリスト」を設置したい位置によります。

私のブログと同じように、記事のすぐ上に設置する場合、<!--topentry-->の直前に挿入します。

ブログタイトルのすぐ下に設置する場合、<body>の中にある<%blog_name>の後ろの方に挿入します。

ブログ紹介文の下に設置する場合、<body>の中にある<%introduction>の後ろの方に挿入します。

 

ここまで出来たら、次は、「スタイルシート編集」の一番下の行から一行あけて 

以下のタグを挿入して下さい。 

.pankuzu {
font-size:12px;
text-align:left;
margin:0px 0px 10px 0px;}
.pankuzu a:link{color:#ff9900}
.pankuzu a:visited{color:#ff9900}

文字の大きさやリンクの色など、自分流にしたい場合は

・文字の大きさを変える : font-size:12px;の数字を変える

・リンクの色を変える : color:#ff9900の#ff9900の部分を変える →カラーコードはこちら

・「TOP」を他の言葉に変える : 「HTML編集」のtitle="TOPページへ">TOP</a>の

                    TOPのところを他の言葉に変える→HOMEとか、ブログタイトルとか

私のブログのように、パンくずリストをBOXの中に入れたい場合

スタイルシートの編集に赤字の部分を追加して下さい。

.pankuzu {
font-size:12px;
text-align:left;
background-color: #ffffff; ←背景の色
border: 3px ridge #ffffff; ←これは枠なのでいらない場合は削除して下さい。
padding: 5px 0px;
line-height: 100%;
clear: both;
margin:0px 0px 10px 0px;}
.pankuzu a:link{color:#ff9900}
.pankuzu a:visited{color:#ff9900}


これは、記事のすぐ上にパンくずリストを設置した場合なので

他の場所だとうまくいかないかもしれません。。。

私の別ブログでもこの方法で設置出来ていますが、

他の方のブログで出来るかはわかりかねますのであしからず・・・<(_ _)>

 タグ
None