WP SiteManagerを使ってパンくずナビを表示する

WordPressサイトでパンくずナビを出力するには、プラグインを利用するのが最も簡単です。
パンくずナビ出力機能を持ったプラグインはたくさんありますが、ここではこのサイトでも利用している「WP SiteManager」を使う方法を解説します。

【コンテンツ】

  1. プラグインをインストールして有効化する
  2. パンくずナビ表示部へ出力コードを記述する
  3. CSSを設定する

【記事執筆時の環境】
WordPress 3.8.1
WP SiteManager 1.0.12

プラグインをインストールして有効化する

WP SiteManagerを、プラグインのインストール画面から検索してインストールします。
インストールが済んだら、有効化してください。

WordPressの管理画面からインストールできない場合は、下記ページからプラグインをダウンロードしてください。

http://wordpress.org/plugins/wp-sitemanager/

パンくずナビ表示部へ出力コードを記述する

パンくずナビを表示するHTML文書中に、以下のコードを記述します。

パンくずナビはリストで出力されます。
ここではパラメーターで、リストのラッパー要素としてdivを指定しています。

指定できるパラメーターの詳細は、下記サイトを参照してください。

http://www.wp-sitemanager.com/usage/breadcrumb/

CSSを設定する

デフォルトでは、ラッパー要素のクラス名として、「bread_crumb」がつきます。
パラメーターで、IDをつけたりクラス名を変更することも可能です。

ラッパー要素のdivに、デフォルトのクラス名「bread_crumb」がついた時のCSS記述例を以下に示します。
※このサイトでの設定です。

スポンサーリンク

特集記事

  • jQuery Mobile Image

    jQuery Mobile を基本から覚える
    スマホサイト制作に最適なフレームワークの利用方法を解説。DEMOページ・サンプルコードで動作を確認できます。

スポンサーリンク

ページの先頭へ