Breadcrumb NavXTでパンクズリストを作成

  • Plugin

    • CMSサイトでは、自分がどのページを見ているかわかるように、パンクズリストを表示していることがあります。今回は、Breadcrumb NavXTでパンクズリストを作成する方法を紹介します。

     出典 : Breadcrumb NavXT

    設定方法

    ダッシュボードの設定＞Breadcrumb NavXTをクリックし、設定画面を開きます。

    一般＞パンクズの区切りにspanタグを入力し、任意のクラスを付けます。投稿タイプ＞投稿階層を親要素に設定します。

    一般＞パンクズの区切りにspanタグを入力し、任意のクラスを付ける。

    投稿タイプ＞投稿階層を親要素に設定

    コード

    CSSに、右矢印になるようにスタイルを作成します。

    .allow{
	display: inline-block;
	width: 0.5em;
	height: 0.5em;
	margin-bottom: 0.1em; 
	margin-right: 0.5em;
	margin-left: 0.1em;
	border-top: solid 1px #272727;
	border-right: solid 1px #272727;
	transform: rotate(45deg);
}

    パンクズリストを挿入したい場所に下記コードを入力します。

    <?php
	if ( function_exists('bcn_display') ){
		bcn_display();
	}
?>

    確認

    プレビューを確認します。

    プレビューを確認

    以上で今回の説明は終了です。区切りをHTMLタグにしておけば、矢印のデザインも色々変更できます。タグで囲んで、色の変更などもできます。

    You may also like