Wordplessでパンくずナビを追加したいと思って、いろいろ調べました。プラグインなしでも、簡単に設置できるですね！設定メモとして残しておきます。詳しいことは、参考にしたサイトを見てください。
なお、今回は「固定ページ」で、カテゴリ分けし、ページの親子関係を設定した部分のみパンくずが現れます。ブログのほうは出ませんでした。あくまで、固定ページのカテゴリでのパンくずの表示方法です。
パンくずナビとは
パンくずナビとは、「HOME＞会社概要＞アクセスマップ」のように、そのページの階層構造をリンクでたどれるようにしたものです。設置したほうがページの構成もわかりやすいし、クリックしただけで、その上位のページに移れるので、操作性＆ユーザビリティが向上します。
Wordplessで親子関係を設置
Wordplessでブログではなく、Webページを作成するときは、「固定ページ」を使うと思います。固定ページにはカテゴリを設定するメニューありません。ブログ投稿のほうにはカテゴリ設定画面があります。
固定ページでカテゴリやページの親子関係を設定する場合は、親になるページを最初に作ってから、子になるページを作成します。で、子のぺージを保存するときに、［ページ属性］で［親］を設定できますので、そこで上位になるページ（親となるページ）を設定すれば、簡単に親子関係が設定できます。
親－子－孫と、階層は深くできます。
Wordplessでの 「パンくずナビ」自動生成
Wordplessでパンくずを表示させるには、プラグインを使う方法と、phpを書き加える方法の二つがあるようです。簡単なのは、phpの追記だと思います。
やり方
- ［functions.php］の一番下に、パンくずが表示されるように、以下のソースを追記。
<?php
function get_breadcrumbs(){
global $wp_query;
if ( !is_home() ){
// Start the UL
echo ‘<ul class="breadcrumbs">’;
// Add the Home link
echo ‘<li><a href="’. get_settings(‘home’) .’">’.
get_bloginfo(‘name’) .'</a></li>’;
if ( is_category() )
{
$catTitle = single_cat_title( "", false );
$cat = get_cat_ID( $catTitle );
echo "<li> » ". get_category_parents( $cat, TRUE,
" » " ) ."</li>";
}
elseif ( is_archive() && !is_category() )
{
echo "<li> » Archives</li>";
}
elseif ( is_search() ) {
echo "<li> » Search Results</li>";
}
elseif ( is_404() )
{
echo "<li> » 404 Not Found</li>";
}
elseif ( is_single() )
{
$category = get_the_category();
$category_id = get_cat_ID( $category[0]->cat_name );
echo ‘<li> » ‘. get_category_parents( $category_id, TRUE,
" » " );
echo the_title(”,”, FALSE) ."</li>";
}
elseif ( is_page() )
{
$post = $wp_query->get_queried_object();
if ( $post->post_parent == 0 ){
echo "<li> » ".the_title(”,”, FALSE)."</li>";
} else {
$title = the_title(”,”, FALSE);
$ancestors = array_reverse( get_post_ancestors( $post->ID ) );
array_push($ancestors, $post->ID);
foreach ( $ancestors as $ancestor ){
if( $ancestor != end($ancestors) ){
echo ‘<li> » <a href="’. get_permalink($ancestor)
.’">’. strip_tags( apply_filters( ‘single_post_title’, get_the_title(
$ancestor ) ) ) .'</a></li>’;
} else {
echo ‘<li> » ‘. strip_tags( apply_filters( ‘single_post_title’,
get_the_title( $ancestor ) ) ) .'</li>’;
}
}
}
}
// End the UL
echo "</ul>";
}
}
?>※こちらのソースは、「Blog × Play Under World」さんが掲載されているソースをほぼ転載しています。
※ 6行目の「<ul class="breadcrumbs">」 部分で、CSSのクラスを指定をしないと、スタイルの設定ができませんのでご注意を！ - スタイルシート（Ex,style.css）に、以下のソースを追記
ul.breadcrumbs {
list-style: none;
padding: 0;
margin: 0;
font-size:12px;
}
ul.breadcrumbs li {
float: left;
0;
padding: 0;
margin: 0 5px 0 }※こちらのソースは、「Blog × Play Under World」さんが掲載されているソースを転載しています。
- パンくずを挿入したいページのテンプレート（page.php）に、以下のソースを追記。
page.phpなどに挿入するなら、「<div id="main">」の一文の下あたりがオススメ。<?php get_breadcrumbs(); ?>
<br class="clearfix">
※php文：パンくずの表示 ※brタグで、フロートの解除をしています。クラス指定は適宜変えてください。
設定情報
有益な情報、ありがとうございます。いろいろお世話になりました。このほか、いろんなページで情報あさりましたが、今回使用したソースは、以下の二つのサイトのソースが大本です。
私はちょっとカスタマイズしただけになります。本当はこのまま掲載しちゃいけないのかもしれないんですが、忘れないメモとして残させてください。もし問題があれば削除します。
