AsaDesign

レシピサイトをつくる(カテゴリー一覧のカスタマイズ)

  • <a>タグにスラッグを付与する。例)href=”#summer”

home.php

<!-- カテゴリーリスト -->
<?php echo category_list(); ?>

<?php
function category_list() { 
  $html = '';
  $categories = get_categories();
  $html .= '<ul class="categories-wrapper">';
  foreach ( $categories as $category ) {
      $html .= '<li>';
      $html .= '<a class="category-link" href="#' . $category->category_nicename . '">';
      $html .= $category->name;
      $html .= '</a>';
      $html .= '</li>';
  }
  $html.= '</ul>';
  return $html;
}
?>

get_categories()でカテゴリー一覧を取得して、カテゴリーの数だけループ処理をしています。

category_nicenameでスラッグを取得することができます。

HTML出力結果

<ul class="categories-wrapper">
  <li><a class="category-link" href="#summer">夏に食べたい</a></li>
  <li><a class="category-link" href="#side-dish">副菜</a></li>
  <li><a class="category-link" href="#grilled-fish">焼き魚</a></li>
  <li><a class="category-link" href="#go-ya-">ゴーヤー</a></li>
</ul>