1年に一度の超セール!Amazonブラックフライデー! ※11/26(金)~12/2日(木)まで!セール品を見る

【SWELL】カテゴリーごとにヘッダーのグローバルメニューとフッターの内容を変更する方法[WordPress]

雑記ブログなどのグローバルメニューのラインナップが雑多だと、専門性・特化性が薄れて残念に見えてしまうことがありますよね?

そこでヘッダーとフッターの内容をカテゴリーに合わせて変更するカスタマイズをしてみました。

すいみん

専門分野ごとにサブディレクトリにしてサイトを避けるのが面倒なので、疑似的に特化サイトっぽく見せたい!という考えです。

SWELLと書いてますが、どのWordPressテーマでも可能です。

目次

[ヘッダー]グローバルメニューをカテゴリーごとに変更する

STEP

新しいメニューの作成

ダッシュボード > メニュー > 新しいメニューを作成しましょう。をクリック

STEP

メニューの内容を決める

今回はWordPressというカテゴリーページの記事を表示した時にグローバルメニューを子カテゴリーの内容にしてみます。

名前は「wp-menu」としています。

最後にメニューを保存ボタンを押し忘れないようにしましょう。

STEP

functions.phpの挿入

functions.phpに下記のコードを挿入します。

安全に入れたい場合はCode Snippetsのプラグインがおすすめです。

function custom_nav_args($args){	
	if ( is_category( array('3','37','36','28','41','42','40') )){
		$args['menu'] = 'wp-menu';		
		$args['container'] = '';	
    $args['items_wrap'] = '%3$s';
		$args['link_before'] = '<span class="ttl">';
		$args['link_after'] = '</span>';	
		return $args;
	} else {
		$args['menu'] = 'header_menu';		
		$args['container'] = '';
    $args['items_wrap'] = '%3$s';
		$args['link_before'] = '<span class="ttl">';
		$args['link_after'] = '</span>';		
		return $args;
	}
}
add_filter('wp_nav_menu_args', 'custom_nav_args');

is_category( array('3','37','36','28','41','42','40') )のところは作成したメニューを表示させたいカテゴリー番号をいれています。

$args['container'] = '';以下は特にSWELLのテーマに合わせて表示が崩れないようにいれています。別テーマの場合は必要ありません(見た目が崩れる場合はテーマに合わせて調べて記述します)

STEP

キャッシュの設定

キャッシュが効いているとメニューが上手く切り替わらないので、キャッシュを切ります。

ダッシュボード > SWELL設定 > ヘッダーをキャッシュする のチェックを外しましょう。

またPjaxによる遷移(Barba v2)は使わないようにしましょう。(SWELL)

またフッターを遅延読み込みさせるはチェックを入れています。

※チェックを外すと、グローバルメニューの内容が反映されてしまいます。

スマホ開閉メニューをキャッシュするのチェックも切っておきましょう。

STEP

見た目の確認

特定のカテゴリー記事を開くと、自然にグローバルメニューが切り替わりました!

[フッター]コンテンツをカテゴリーごとに変更する

フッターコンテンツの切り替え方法です。

こちらはウィジェットからコンテンツを入れ込むと思いますので、プラグインを淹れるだけで解決します。

STEP

Widget Options のプラグインを入れる

ダッシュボード > プラグイン > 新規追加から Widget Optionsで検索します。

今すぐインストールボタンを押して、有効化しましょう。

STEP

ウィジェットの設定

ダッシュボード > 外観 > ウィジェット へ

ウィジェットの項目の下に表示条件が設定できるようになってますので、チェックを入れて設定するだけです。

[サイドバー]コンテンツをカテゴリーごとに変更する

フッターと基本的にやり方は一緒です。

ウィジェットをWidget Optionsで設定してあげます。

注意するべき箇所はSWELLのキャッシュでヘッダーと同じく切る必要があります。

カテゴリー別人気記事ランキングの作り方

おまけです。

  1. SWELLのブログパーツを開きます。
  2. 投稿リストブロックを作成してカテゴリーでソートしてあげて公開。
  3. 発行されたショートコードをウィジェットのカスタムHTMLに挿入。
  4. あとはWidget Optionsでカテゴリーで制限をかけると即席で作成できます。
すいみん

カテゴリー別に何か表示したい時にWidget Optionsはとても便利です!

カテゴリーごとにヘッダーのグローバルメニューとフッター/サイドバーの内容を変更刷る方法まとめ

本記事ではカテゴリーごとにヘッダーのグローバルメニューとフッター/サイドバーの内容を変更する方法を書きました。

ヘッダーとフッターは共通パーツなので、カテゴリーには関係のない情報が表示されてしまうのを避けたい場合は、本記事のカスタマイズで擬似的に特化サイトっぽく見せても良いと思います。

絞り込み検索の作成方法

すいみん

より良い記事を見つけてもらうカスタマイズです。

【WordPress】絞り込み検索の作成方法

目次
閉じる