ワサコレ戦記の備忘録-pone

pone_web ワサコレ・スマホ・タブレット・パソコン・クルマ

TOP >> スポンサー広告 >> 【FC2】パンくずリストを作成する -1-TOP >> Web site >> 【FC2】パンくずリストを作成する -1-

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
※古い記事を試すときは自己責任で!

この記事にリンクを貼る


Trackback: -- |  Comment: --

【FC2】パンくずリストを作成する -1-

【FC2 BLOG♘用】
パンくずリストを作成する手順です。


パンくずリストとはこんなのです。
pan.png


各ページに自分がどの階層を見ているか確認ができるようにするのと同様内部リンク構造を最適化する役目も持ちSEO対策効果が望めます。


パンくずリストをWikipediaで検索すると

パンくずリスト(breadcrumb list)は、ウェブサイト内におけるウェブページの位置をツリー構造を持ったハイパーリンクの一覧として示すもの。パンくずナビ、トピックパス、フットパスとも言う。

日本語では「パンくずリスト(breadcrumb list)」だが、英語では単に“breadcrumbs”または“breadcrumb navigation”というのが一般的。「パンくずリスト」という名前は、童話『ヘンゼルとグレーテル』で、主人公が森で迷子にならないように通り道にパンくずを置いていった、というエピソードに由来する。

ウェブディレクトリのような大規模なウェブサイト内において、利用者がサイト内での現在位置を見失わないようにし、ナビゲーションを助けるために使われる。

と書かれていました。

FC2ブログの場合は、変数を使ってこのリストを作成することが可能です。

<!--not_index_area-->
<div class="pan">
<!--permanent_area-->
<!--topentry-->
<a href="<%url>" title="TOPページへ">TOP</a> > <a href="<%topentry_category_link>"><%topentry_category></a>
> <%sub_title>
<!--/topentry-->
<!--/permanent_area-->
<!--category_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > CATEGORY - <%sub_title>
<!--/category_area-->
<!--date_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > <%now_year>年<%now_month>月
<!--/date_area-->
<!--tag_area-->
<a href="<%url>" title="TOPページへ">TOP</a> > <%tag_word>
<!--/tag_area-->
</div>
<!--/not_index_area-->


使用されているテンプレートの表示したい場所に上記のコードを貼り付ければパンくずリストの完成です。


パンくずリストはトップページには表示しませんのでプレビュー画面では確認できません。

更新ボタンを押して各ページを開いて確認して下さい。


また、上記のコードにはスタールシートのclassで"pan"というスタイルを使っています。

必要であれば一緒にスタイルシートに追記して下さい。


.pan { 
padding : 5px 5px 5px 20px;
border-bottom-width : 1px;
border-bottom-style : solid;
border-bottom-color : #c1bfad;

border-right-width : 1px;
border-right-style : solid;
border-right-color : #c1bfad;
position: relative;
font-size : 100%;
}
※古い記事を試すときは自己責任で!
Web siteの関連記事

この記事にリンクを貼る


TOP > スポンサー広告 > 【FC2】パンくずリストを作成する -1-TOP > Web site > 【FC2】パンくずリストを作成する -1-

この記事に対するコメント

コメントの投稿

Secret

トラックバック

トラックバックURL
→http://recoboo.blog28.fc2.com/tb.php/86-8943af97
この記事にトラックバックする(FC2ブログユーザー)

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