アーカイブページの作成を作成してみよう。

現時点でアーカイブページの役割は「index.php」のテンプレートで表示している。
現状でもほとんど問題がないが、見出しの部分のみ変更したい。
したがって今回は、index.phpを複製して、archive.phpを作成する

the_archive_title(タイトルの直前に出力する文字, タイトルの直後に出力する文字)
                                      省略可

1. 「dummy」 内に「index.php」を複製し、ファイル名を「archive.php」に変更する
2. 「dummy」 › 「archive.php」をテキストエディタで開く
3. 「.p-articles」のsection要素をdiv要素に変更する

<main class="l-main">
  <div class="p-articles">
    <h2 class="c-heading -primary">Blog & News</h2>

    <?php endif; ?>
  </div>

</main>

4. h2要素をh1要素に変更し、要素内容をthe_archive_title()に置き換える

<h1 class="c-heading -primary"><?php the_archive_title(); ?></h1>

5. 上書き保存
6. サイトにアクセス
   （http://localhost/wp-lesson/）
7. カテゴリーの一覧を表示して、 archive/phpが読み込まれているかを確認

条件分岐タグの詳細はWordPress Codex 日本語版を参照

ページによる分岐をやってみよう

1. 「dummy」 › 「template-parts」 › 「content.php」をテキストエディタで開く
2. 見出しをトップページの時には h3 要素、
   それ以外のぺーじでは h2 要素になるようにする

<?php if ( is_front_page() ) : ?>
<h3 class="p-article__title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<?php else : ?>
<h2 class="p-article__title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<?php endif; ?>

3. 上書き保存
4. サイトにアクセス
   （http://localhost/wp-lesson/）
5. アーカイブページで、見出しが h2 要素になっているかを確認

アーカイブページの作成を作成してみよう。

現時点では、検索結果を「index.php」のテンプレートで表示している。
現状でもほとんど問題がないが、こちらも見出しの部分を変更したい。
したがって今回は、archive.phpを複製して、search.phpを作成する

the_search_query()

1. 「dummy」 内に「archive.php」を複製し、ファイル名を「search.php」に変更する
2. 「dummy」 › 「search.php」をテキストエディタで開く
3. h1要素の要素内容を、the_search_query()に置き換える

<h1 class="c-heading -primary"><?php the_search_query(); ?> の検索結果</h1>

4. 記事が見つからなかった時のメッセージを「見つかりませんでした」に変更

<?php else : ?>

  <p>見つかりませんでした。</p>

<?php endif; ?>

5. 上書き保存
6. サイトにアクセス
   （http://localhost/wp-lesson/）
7. 検索結果が search.phpで表示されているかを確認

404.phpを作ってみよう。

get_search_form(表示するか？)
                  省略可能

表示するか？： 画面に表示する場合は true（初期値）、HTMLを取得する場合は false

1. 「dummy」 内に「page.php」を複製し、ファイル名を「404.php」に変更する
2. 「dummy」 › 「404.php」をテキストエディタで開く
3. 以下のように変更する
   （ループを削除したり、h1要素の内容を変更したり、画像を削除したり、the_contets()の部分を変更したりする）

<?php get_header(); ?>

  <main class="l-main -single">
    <header class="p-hero">
      <h1 class="p-hero__title">404 Not Found</h1>
    </header>
    <div class="l-contents -themeWhite">
      <div class="p-article">
        <div class="l-container -slim">
          <section class="p-article__body">
            <h2>お探しのページは、見つかりませんでした。</h2>
            <p>検索で見つかるかもしれません。</p>
            <?php get_search_form(); ?>
          </section>
        </div>
        <!-- /.l-container -->
      </div>
      <!-- /.l-article -->
    </div>
    <!-- /.l-contents -->
  </main>

<?php get_footer(); ?>

3. 上書き保存
4. 存在しないページにアクセス
   （http://localhost/wp-lesson/xxxx/）
5. 404.phpの内容が表示されているかを確認