Webの記録

WordPressサイトでパンくずリストを簡単設置♪

投稿日:

この記事は約 2 分で読めます。

Webサイトで、よく階層が深くなってくると「パンくずリスト」を付けます。

WordPressサイトでも簡単にパンくずリストを付けられないかな?という事で、プラグインを探しました。

Breadcrumb NavXT」というプラグインを使えば、わりと簡単に設置出来たので、メモしておきます。

作業1

Breadcrumb NavXT」をダウンインストールし、有効化する。

Breadcrumb-NavXTインストール画面

作業2

ダッシュボード画面の「設定」の所に「Breadcrumb NavXT」が追加されているので、クリックして画面を開く。

Breadcrumb-NavXT設定画面

「一般」タブの「ホーム」の「パンくずリストにホームを配置」にチェック、「ホームタイトル:」にパンくずリストの起点の言葉「ホーム」などを入力する。

作業3

パンくずリストを表示させたい部分のphpファイルに以下のように記述する。

<div class="breadcrumbs">
<?php
	if(function_exists('bcn_display')){
		bcn_display();
	}
?>
</div><!-- /.breadcrumbs -->

作業4

簡単に設置が出来ました!!
あとは、cssで表示を整えて完成です♪

Breadcrumb-NavXT表示イメージ

-Webの記録
-, ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This blog is kept spam free by WP-SpamFree.

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

no image

WordPressサイト内検索でのキーワードが分かるプラグライン「Search Meter」を試してみた。

この記事は約 1 分で読めます。 アクセス解析をしていると、どんなキーワードで検索されたのか?を知ることができます。 しかし、キーワードを入力して検索できなかった結果を知る事はなかなか知る事ができない …

no image

WordPress 「wp_head」を入れて上部に隙間ができた時

この記事は約 1 分で読めます。 WordPressでオリジナルテーマを作っていて、「wp_head();」を入れた途端・・・ブラウザ上部に28pxの隙間が出来る現象が起きました。 ブラウザによっては …

no image

DreamweaverCS4にHTML5+CSS3のコードヒント・ドキュメントタイプを!

この記事は約 1 分で読めます。 コーディングの時に主に「Dreamweaver」を使用しています。バージョンは、CS4とCS5。 HTML5をぼちぼち・・・なところで、CS5は最初から「HTML5」 …

no image

ムームードメインで取得した独自ドメインをエックスサーバーで使う設定方法

この記事は約 1 分で読めます。「エックスサーバー」を利用する事が決まっていて、ドメインをどこで取得しようかな?と思った時、「エックスドメイン」という選択肢もあったのですが、今回は「ムームードメイン」 …

no image

IE6で透過pngを表示してみました♪

この記事は約 1 分で読めます。IE6対策をいつまですれば良いのかなぁというところですが、まだもう少しIE6を意識してサイトを作ってます。 今回は、IE6ではキレイに表示されない透過pngをキレイに表 …