WooCommerceストアフロントテーマ複数のカテゴリテンプレートを作成する

公開: 2020-10-12

WooCommerceストアフロントテーマ複数のカテゴリテンプレートを作成する 多くのオンラインストアでは、カテゴリ、タグ、カスタム投稿タイプ、および分類法に異なるテンプレートを使用するのが一般的です。 カテゴリに異なるテンプレートを使用する場合は、カテゴリページに特定の機能を追加できます。 たとえば、カテゴリ画像を追加したり、カテゴリの説明を表示したり、ユーザーがカテゴリにサブスクライブできるようにしたり、カテゴリごとに異なるレイアウトを選択したりできます。

WooCommerceストアフロントテーマ複数のカテゴリテンプレートを作成する

この簡単なチュートリアルでは、WooCommerceストアでカテゴリテンプレートを作成する方法を紹介します。

カテゴリページのテンプレート階層

WordPressには強力なテンプレートシステムがあり、さまざまなWebサイトセクションにさまざまなテンプレートを使用してテーマを作成できます。 ページを表示するとき、WordPressは事前定義された階層順序でテンプレートを探します。 たとえば、カテゴリページを表示するには、次の順序でテンプレートを検索します。

category-slug.php > category-id.php > category.php > archive.php > index.php

最初に検索するテンプレートは、カテゴリスラッグを使用してその特定のカテゴリに固有のテンプレートです。 category-design.phpテンプレートは、「デザイン」カテゴリを表示するために使用されます。 ただし、カテゴリスラッグテンプレートが見つからない場合、WordPressはカテゴリIDテンプレートを探します。

次に、一般的なカテゴリテンプレート(通常はcategory.php)を探します。 ただし、一般的なカテゴリテンプレートが存在しない場合、WordPressは一般的なアーカイブテンプレートを探します。

その後、index.phpテンプレートを使用してカテゴリを表示します。

カテゴリテンプレートを作成する方法

典型的なcategory.phpテンプレートは次のようになります。

 <?php

/ **

*シンプルなカテゴリテンプレート

* /

 get_header(); ?>

 <section id = "primary" class = "site-content">

<div id = "content" role = "main">

 <?php

//表示する投稿があるかどうかを確認します

if(have_posts()):?>

 <header class = "archive-header">

<h1 class = "archive-title">カテゴリ:<?php single_cat_title( ''、false); ?> </ h1>

 <?php

//オプションのカテゴリの説明を表示します

 if(category_description()):?>

<div class = "archive-meta"> <?php echo category_description(); ?> </ div>

<?php endif; ?>

</ header>

 <?php

 //ループ

while(have_posts()):the_post(); ?>

<h2> <a href="<?php the_permalink()?> "rel =" bookmark "title =" <?phpthe_title_attribute()。?> "> <?php the_title();へのパーマネントリンク?> </a> </ h2>

<small> <?php the_time( 'F jS、Y')?> by <?php the_author_posts_link()?> </ small>

 <div class = "entry">

<?php the_content(); ?>

  <p class = "postmetadata"> <?php

  Comments_popup_link( 'コメントはまだありません'、 '1コメント'、 '%コメント'、 'コメント-リンク'、 'コメントは閉じています');

?> </ p>

</ div>

 <?php endwhile;

 それ以外の場合:?>

<p>申し訳ありませんが、条件に一致する投稿はありません。</ p>

 <?php endif; ?>

</ div>

</ section>

 <?php get_sidebar(); ?>

<?php get_footer(); ?>

カテゴリスラッグが「classy」の「ClassyClothes」というカテゴリがあり、このカテゴリを他のカテゴリとは異なる方法で表示したいとします。 この結果は、その特定のカテゴリのテンプレートを作成することで実現できます。

これを行うには、 [外観]> [エディター]に移動します。 右側にいくつかのテーマファイルが表示されます。 archive.phpをクリックします。 そこにない場合は、 category.phpを探してください。 ただし、Storefrontテーマを使用している場合は、 archive.phpがあります。 archives.phpファイル

archive.phpファイルのすべての内容をコピーして、メモ帳などのテキストエディタに貼り付けます。 このファイルをcategory-design.phpとして保存します。

次のステップは、 wp-content> Themes> Storefrontthemeに移動することです。 category-design.phpファイルをテーマディレクトリにアップロードします。

カテゴリdesign.php

このテンプレートに加えた変更は、この特定のカテゴリのアーカイブページにのみ表示されることに注意してください。 この手法を使用して、必要な数のカテゴリのテンプレートを作成できます。 ファイル名としてcategory- {category-slug} .phpを使用する必要があります。 カテゴリスラッグは、WordPress管理エリアのカテゴリセクションにあります。

これは、category-slug.phpテンプレートの別の例です。 これはcategory.phpテンプレートと同じですが、少し変更があります。

 <?php

/ **

*シンプルなカテゴリテンプレート

* /

get_header(); ?>

<section id = "primary" class = "site-content">

<div id = "content" role = "main">

<?php

//表示する投稿があるかどうかを確認します

if(have_posts()):?>

<header class = "archive-header">

<?php

//このテンプレートはデザインカテゴリにのみ使用されるため

//カテゴリのタイトルと説明を手動で追加できます。

//または、画像を追加したり、レイアウトを変更したりすることもできます

?>

<h1class = "archive-title">デザイン記事</ h1>

<div class = "archive-meta">

デザインとウェブに関する記事とチュートリアル。

</ div>

</ header>

<?php

//ループ

while(have_posts()):the_post();

<h2> <a href="<?php the_permalink()?> "rel =" bookmark "title =" <?phpthe_title_attribute()。?> "> <?php the_title();へのパーマネントリンク?> </a> </ h2>

<small> <?php the_time( 'F jS、Y')?> by <?php the_author_posts_link()?> </ small>

<div class = "entry">

<?php the_excerpt(); ?>

<p class = "postmetadata"> <?php

Comments_popup_link( 'コメントはまだありません'、 '1コメント'、 '%コメント'、 'コメント-リンク'、 'コメントは閉じています');

?> </ p>

</ div>

<?php endwhile; //ループを終了します

それ以外の場合:?>

<p>申し訳ありませんが、条件に一致する投稿はありません。</ p>

<?php endif; ?>

</ div>

</ section>

<?php get_sidebar(); ?>

<?php get_footer(); ?>

ただし、category-slugテンプレートを使用したくない場合は、category-idテンプレートを使用して特定のカテゴリIDのテンプレートを作成できます。

カテゴリに条件付きタグを使用する方法

テーマのテンプレートを作成するときは、追加のテンプレートが必要かどうかを確認する必要があります。 これは、作成したいものがそれほど複雑ではなく、汎用テンプレート内の条件付きタグを使用して実現できる場合があるためです。

WordPressは多くの条件付きタグをサポートしています。 それらの1つは、is_category()条件付きタグです。 これを使用して、条件が一致した場合に異なる出力を表示するようにテンプレートを変更できます。 たとえば、カテゴリのカテゴリアーカイブページに追加情報を表示したい場合があります。 これを行うには、このコードをcategory.phpファイルの<?php if(have_posts()):?>の直後に追加するだけです。

 <header class = "archive-header">

<?php if(is_category( 'Featured')):?>

<h1class = "archive-title">注目の記事:</ h1>

<?php else:?>

<h1 class = "archive-title">カテゴリアーカイブ:<?php single_cat_title(); ?> </ h1>

<?php endif; ?>

</ header>

結論

この投稿では、カテゴリ、タグ、カスタム投稿タイプ、および分類法にさまざまなテンプレートを使用できることを強調しました。 さらに、WordPressでカテゴリページに使用されるテンプレート階層を共有しました。

さらに、カテゴリテンプレートを作成する方法と、カテゴリに条件付きタグを使用する方法を示しました。

同様の記事