テーマを一から作成する 第15回目
前回は検索機能を追加しました。今回は、タグページを作成します。
第14回目
検索機能を追加する[search.php][get_search_form][the_search_query]
スポンサーリンク
タグページを表示することができるテンプレートは以下の5つありますが、今回はtag.phpを利用します。
1 tag-スラッグ名.php
2 tag-ID番号.php
3 tag.php
4 archive.php
5 index.php
今回作成するタグページの構成は、基本的にindex.phpと変わりません。「記事」の部分に特定のタグ記事一覧を表示させます。
まずはtag.phpテンプレートを作成し、テーマディレクトリ(/wp-content/themes/sample/以下)にアップロードして下さい。外観>テーマの編集 で見てみると投稿タグテンプレートとして認識されていることが分かります。
tag.phpが用意できたら、下記のコードを記述して下さい。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 |
<?php get_header(); ?> <main> <p><?php single_tag_title(); ?>記事の一覧です</p> <?php if(have_posts()): while(have_posts()):the_post(); ?> <h1><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1> <time datetime="<?php the_time('Y-m-d'); ?>"><?php the_time('Y.m.d'); ?></time> <p><?php the_category(', '); ?></p> <p><?php the_tags(''); ?></p> <!--アイキャッチ画像--> <?php if( has_post_thumbnail() ): ?> <a href="<?php the_permalink(); ?>" ><?php the_post_thumbnail('thumbnail'); ?></a> <?php else: ?> <a href="<?php the_permalink(); ?>" ><img src="<?php echo get_template_directory_uri(); ?>/images/no-image.png" ></a> <?php endif; ?> <!--アイキャッチ画像End--> <p><?php the_content('Read more'); ?></p> <?php endwhile; endif; ?> <?php previous_posts_link('新しい投稿ページへ'); ?> <?php next_posts_link('古い投稿ページへ'); ?> </main> <?php get_sidebar(); ?> <?php get_footer(); ?> |
5行目
single_tag_titleタグでタグ名を取得しています。
13行目
the_tagsタグでその記事の持つタグを表示させています。
例)「プログラミング」タグが付けられた記事一覧(<main>内)。
これまで(第1〜15回目)の解説を、まとめて整理したテーマファイルは以下のリンクからダウンロードできます。
おすすめ関連ページ
参照ページ
WordPress
Codex日本語版