habakiriの子テーマでウィジェットエリアを追加してページフッターに横並びメニューを表示する

habakiriは「アクションフック」と「フィルターフック」が豊富にあってカスタマイズ便利と書いてますが、具体的にどんなことをどこに書けばいいか分からない！デザイナーだから！そしてかなり調べてもなかなか出てこない！

親のfunction.phpに書いてある151行目「Register widget areas」を子のfunciton.phpにコピペして、内容だけ変えてみても、やはり競合して表示できない。

親のregister_sidebarを子テーマのfunction.phpでremove（削除）した後に、親テーマの内容＋追加分を記載するやり方も載っていたが、それだとhabakiriテーマがアップデートした時に変更があったらなんか怖い…。

そこで、本来のwordpressのアクションフックを使って普通にウィジェットエリアを追加することで解決しました。

■子テーマのfunciton.phpに以下を追記する（子テーマを定義している箇所の後ろ）

//親テーマのウィジェット読み込み後、子テーマのウィジェットを追加する
add_action( 'init', 'add_sidebar' );
function add_sidebar(){
 register_sidebar( array(
  'name'          => __( 'Footer-menu', 'habakiri' ),
  'id'            => 'footer-menu-area',
  'before_widget' => '<div id="%1$s" class="widget footer-menu-widget %2$s">',
  'after_widget'  => '</div>',
  'before_title'  => '<h2 class="footer-menu-widget__title">',
 ) );
}

nameの「Footer-menu」は、ウィジェットのページに表示される名前になるっぽい。
これは任意の文字で。
idも独自のものを。
before_widgetは専用のスタイルシートを適用するclassにするため 「footer-menu-widget」とした。
before_titleも同じく、「footer-menu-widget__title」とした。

■子テーマの「footer.php」に以下を追加
行数１５：<?php do_action( 'habakiri_before_footer_content' ); ?>の後に

<!-- 追加のフッターメニューエリア -->
  <?php if ( is_active_sidebar( 'footer-menu-area' ) ) : ?>
  <div class="footer-menu-area">
   <div class="container">
    <div class="row">
     <?php dynamic_sidebar( 'footer-menu-area' ); ?>
    </div>
   </div>
  </div>
  <?php endif; ?>
  <!-- 追加のフッターメニューエリア　ここまで -->

既に書いてある「footer-widget-area」を真似して、
ウィジェットが有効なら、その内容を表示。という感じ。

管理画面の「ウィジェット」ページを見ると「Footer-menu」という新たなウィジェットが追加されているので、そこに新規作成したメニューを持ってくれば良い。

今回はメニューを表示して、かつ横並びにして、右詰めにしたいので。
続きはこちら