【Twenty Twelve】フッターにメニューを追加する方法

Twenty Twelveでは、Twenty Elevenのようなフッターに何かを表示するためのウィジェットがありません。

そこで、フッターにサイトマップやトップページなどのリンクを作成したいときには、ウィジェットをfunctions.phpファイルに追加して作成する方法もありますが、今回はメニューを追加して実現する方法について。

フッターにメニューを追加する

フッターにメニューを追加するためにfunctions.phpファイルにある「register_nav_menu( ‘primary’, __( ‘Primary Menu’, ‘twentytwelve’ ) );」の下あたりに以下のコードを追加します。

日本語に訳す必要が無いので、単純なコードにしてフッターメニューを追加しています。

register_nav_menu( 'footer-menu', 'フッターメニュー' );

コードを追加したあと、外観⇒メニューを確認するとフッターメニューが追加されます。

フッターメニューに登録するメニューを選択して保存します。

次にフッターメニューに登録したメニューを表示するために、footer.phpファイルのdivのsite-infoクラスのコードを削除してwp_nav_menuを追加すると、フッターにメニューが表示されます。

<div class="site-info">
			<?php wp_nav_menu( array('theme_location' => 'footer-menu')); ?>
</div><!-- .site-info -->

この段階では、縦にリスト表示されます。

このままでも良いのですが、横にリストを表示したい場合、style.cssの例が以下のようになります。ここは好みなので、好きなようにデザインしてください。

.site-info ul {
	text-align: center;
}
.site-info li {
	display: inline-block;
	margin-right: 20px;
}

下の画像は、上記のコードをstyle.cssに追加したレイアウトになります。