WordPress テーマ 固定ページ,Navメニュー作成方法

ファイル名は page.php

WordPressループは回す

WordPressループを回さないと、管理画面からの入力を表示することが出来ないため

//もし、記事があったら
<?php if (have_posts()) :?>

//記事の数だけループしなさい 固定ページは1つしかないけど、、、
    <?php while (have_posts()): the_post(); ?>

//タイトルを表示しなさい
    <h2 class="pageTitle"><?php the_title(); ?><span><?= strtoupper($post->post_name) ; ?></span></h2>

    <main class="main">
        <div class="container">
            <div class="content">

//管理画面で入力した記事を表示しなさい
                <?php the_content(); ?>
            </div>
        </div>
    </main>

    <?php endwhile; ?>
<?php endif; ?>

Nav Menuを利用できるようにする

functions.phpに追記

//メニューを管理画面に追加
add_theme_support('menus');

function register_my_menus() {
  register_nav_menus( array( //複数のナビゲーションメニューを登録する関数
  //'「メニューの位置」の識別子' => 'メニューの説明の文字列',
    'main-menu' => 'Main_menu',
    'footer-menu'  => 'Footer_menu',
  ) );
}
//上記メニューを登録
add_action( 'after_setup_theme', 'register_my_menus' );

これで管理画面に menus が表示される

f:id:happy_teeth_ago:20200801162305j:plain:w100

wp_nav_menu($args)

header.phpに記載する
ulタグとliタグを出力するのに注意すること

//これは下記のHTMLを出力する
                <?php
                    $args = array(

//管理画面で指定するもの下記画像参照
                        'menu' => 'Main_menu',
//ulタグのクラス名
                        'menu_class' => '',
//ulをdivかnavで包み込むか?
                        'container' => 'false',
                    );

//これで配置
                    wp_nav_menu( $args );
                ?>


//===これが上記と同じになる
   <ul class="">
                    <li><a href="#">HOME</a></li>
                    <li><a href="#">わたしたちについて</a></li>
                    <li><a href="#">アクセス</a></li>
                    <li><a href="#">最新情報</a></li>
                    <li><a href="#">お問い合わせ</a></li>
   </ul>

[f:id:happy_teeth_ago:20200806155323j:plain:600]

公式サイトドキュメント wp_nav_menu() Walker

https://wpdocs.osdn.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/wp_nav_menu#.E3.82.AB.E3.82.B9.E3.82.BF.E3.83.A0.E3.82.A6.E3.82.A9.E3.83.BC.E3.82.AB.E3.83.BC.E3.82.AF.E3.83.A9.E3.82.B9.E3.82.92.E4.BD.BF.E7.94.A8.E3.81.99.E3.82.8B