パンくずリストを入れてみました♪

【ご注意】2015.5.8

以下ご紹介している提供元の「http://open-lab.jp」の読み込みができなくなっており、ウェブサイトの表示に時間がかかってしまう事象が発生しています。ご注意ください。(事象が継続する場合は、貼り付けたコードを削除するなどご判断ください)

なお、ログインが表示されない場合は、ドメインの後ろに/loginと入力してください。

例)当サイトの場合、「http://jim-do-it-yourself.jimdo.com/login」

 

写真素材:足成
写真素材:足成

ホームページでよくみかける、こんな表示。

↓↓↓↓↓↓

HOMEMacMacBook Air>仕様

 

自動で表示できないのかなぁ、と思っている人いませんか?

今回は、こんなパンくずリストをJimdoで簡単に、設定できる方法発見したのでご紹介します。

------------------------------------------------------------------------------------------------------------

■残念なお知らせ

以下の方法は、旧レイアウトのみに対応しています。NewUIでは対応していません。

(旧レイアウト・・・2014年8月13日までにアカウント取得した方が使えるレイアウト)

------------------------------------------------------------------------------------------------------------


階層のあるホームページを作っている方に、おすすめ。

「パンくずリスト」という名前は、主人公が森の中で迷子にならないように、“パンくず”を落としながら歩いたという、童話「ヘンゼルとグレーテル」のエピソードが言葉の由来。

ホームページ内でも、クリックしながら色んなページを読みすすめていくと、現在の場所がわからず迷子になってしまう場合があります。折角閲覧してくれているのに、勿体ないですよね。

 

そこで、それを回避する為に、トップページからの階層、つまりカテゴリ名(ナビゲーション)を表示して、現在どんな位置(属性)にいるのかわかるようにする、つまり、閲覧者のストレスをなくす方法の一つです。

 

▼やり方は、簡単♪

「設定」→「ヘッダーを編集」を開いて、下記の内容を貼り付けるだけ。

↓こちらからコピペどうぞ。

<script type="text/javascript" src="http://open-lab.jp/jimdo/breadcrumb.js">
</script>

※前回の「タイトル文字に影をつける」などのソースがある場合は、改行して下に貼り付ければOK。


 

このコード、実は、Jimdo Japan のITマネージャー宮西さんによる公開記事で確認しました。

ありがたいですね~。

 

参考サイト:Hiromitz@blog → Jimdoでパンくずリストを簡単に追加する

※CSS調整をしたい方は、直接上記ブログでご確認ください。
Jimdoサポートでも紹介しているようです。

 

 

【補足】 階層が深くなくても、気をつけて欲しいことがあります。

ページの見出しには、ナビゲーションで設定したタイトルを必ず入力しておきましょう。

 

↓詳しくはこちらもご参考ください。

当サイト内、「知っておきたいエトセトラ」ページ→“表記を統一する:その1”

 

 

因みに。ブログ機能には、パンくずリスト入らないんですよね。今後に期待。