WORDPRESS カスタムメニュー メニューの位置 追加

ご挨拶

ラーメンが食べたいですね。常に。
どのようなテンションでブログを書けば良いか迷うことが多いですね。
日によってテンションが違うので。

カスタムメニューとは?

ところでWORDPRESSでカスタムメニューというのがあるのはご存知でしょうか?
これです。これ。

管理画面で[外観] – [メニュー]にアクセスすると、自分でメニューを作成することができます。
こちら便利な機能なんですが、デフォルトではメニューの表示位置が少ないため、別々のメニューを各所に表示させたい・・・
なんて時は困ってしまいます。

カスタムメニューの表示位置を増やす方法

ここでWORDPRESSカスタムでは定番のfunctions.phpの登場です。
register_nav_menusというコードを使います。
基本的にはtwentysixteenなどのテーマではregister_nav_menusはもうすでにfunctions.phpにすでに存在すると思いますので
functions.phpをエディタ等で開いてregister_nav_menusで検索します。
当ブログには

function.php
// This theme uses wp_nav_menu() in two locations.
register_nav_menus( array(
    'primary' => __( 'Primary Menu', 'twentysixteen' ),
    'social'  => __( 'Social Links Menu', 'twentysixteen' ),
) );

このように登録されていました。
今回はフッターメニューを追加したいので以下のように改変します。

function.php
// This theme uses wp_nav_menu() in two locations.
register_nav_menus( array(
    'primary' => __( 'Primary Menu', 'twentysixteen' ),
    'social'  => __( 'Social Links Menu', 'twentysixteen' ),
    'footer' => __( 'フッターメニュー', 'twentysixteen' ),
) );

すると以下のように「メニューの位置」に設定した「フッターメニュー」が現れます。

表示させたいメニューが完成したら「フッターメニュー」にチェックを入れて保存します。

あとは表示したい部分に以下のコードを書けばオッケーです。
今回はfooter.phpにコードを書き込みます。
コードは一例です。

footer.php
<?php if ( has_nav_menu( 'footer' ) ) : ?>
<nav class="footer-navigation" role="navigation" aria-label="<?php esc_attr_e( 'フッターメニュー' ); ?>">
    <?php
        wp_nav_menu( array(
            'container' => 'nav',
            'theme_location' => 'footer_menu',
            'menu_class'     => 'footer_menu',
            'depth'          => 1,
        ) );
    ?>
</nav><!-- .footer-navigation -->
<?php endif; ?>

もしくは

<?php wp_nav_menu( array('container' => 'nav','theme_location' => 'footer' ) ); ?>

これで希望した部分にフッターメニューが表示されているはずです。完成!

WORDPRESS

Posted by bistro