WordPressで投稿ページをカスタマイズしていく方法(single.phpの書き方)【カスタマイズ・プラグインなし】

キービジュアル

目次

こんにちは、オトナ帝国です。

以前、カスタマイズのススメを出しておりましたが、

今回はWordpressのカスタマイズ、における投稿ページとアーカイブページを作成していくための内容を記載していきます。

投稿ページはsingle.phpで制御する

Wordpressにはいくつかのファイルがあって、それらがテンプレートを作り出しております。投稿の内容はsingle.phpというファイルで制御することになっています。果たしてなぜsingleなのか・・

every single person 各個人.
write down every single word 一語一語を書き留める.

このあたりのsingleは 個々の,別々の,それぞれの.とかの意味ですが、、そういうこと?やはり納得はいかない・・まぁかといってpostは他で使うし無理か、、と思いつつ・・七不思議に認定しようと思います。

まずはオーソドックスなテンプレート

//phpファイル
<?php get_header();?>
<?php if (have_posts()) : ?>
<?php while ( have_posts() ) : the_post(); ?>
	<h1 class="noteContent__head"><?php the_title(); ?></h1>
	<?php the_content(); ?>
<?php endwhile; endif; ?>
<?php get_footer();?>

まずは投稿ページのテンプレートとしてタイトルと中身だけ表示するようなソースだけを上では記載してます。

headerとfooterのテンプレート読み込み

//phpファイル
<?php get_header();?>
<?php get_footer();?>

ヘッダーテンプレートとfooterテンプレートで上下をはさんであげます。これはheader.phpの中身とfooter.phpの中身が読み込まれている状態です。この書き方は基本的にページ系のテンプレートではどこでも記載されることになります。

コンテンツ(投稿記事内容)の制御

//phpファイル
<?php if (have_posts()) : ?>
<?php while ( have_posts() ) : the_post(); ?>
コンテンツエリアコンテンツエリア
<?php endwhile; endif; ?>

上記の部分はいわゆる分岐とループを表現するエリアになっています。この間の中でそれぞれのコンテンツのエリアが表示されます。

このコンテンツのエリアに、最初に変数エリアで$imageにサムネイルリンク、$titleに記事タイトル、$contentに記事の中身を格納してあげて、

//phpファイル
<?php if (have_posts()) : ?>
<?php while ( have_posts() ) : the_post(); ?>
    <?php
        $image = get_the_post_thumbnail_url();
        $title = get_the_title();
        $content = get_the_content();
    ?>
	<h1><?php echo($title); ?></h1>
	<h1><?php the_title(); ?></h1>
	<?php if (has_post_thumbnail()) : ?>
	<p><img src="<?php echo($kv);?>" alt="キービジュアル"></p>
	<?php endif; ?>
	<div><?php echo($contentValue) ; ?></div>
<?php endwhile; endif; ?>

それぞれをechoで呼び出してあげる、みたいな書き方が個人的には好みです。一応titleだけ2行参考に書いてますが、個人的には好みだと思っています。

//phpファイル
	<h1><?php echo($title); ?></h1>
	<h1><?php the_title(); ?></h1>

個人的にはphpによるデータの取得のエリアとhtmlによる表示のエリアの役割は明確に分離させておくほうが、ソースのどこで何を取得したか、を考えなくていいので個人的には好きですね。まぁtitleぐらいならいいか、という例外もありますけど。

あるいはこれは記事に限らず、テンプレートファイルを作る場合に、ファイル前半部分取得したものを後からも使う、みたいなときとかは、先に変数に格納しておいたほうがよさそうなイメージです!!

まぁ好みな気がします、ただ表示させたい時と変数に格納するためにデータを取得する場合の関数は異なる(the_title(); とget_the_title();の違い)ことは注意が必要です。

最後に

今回はsingle.phpによるという高ページの制御について書いてみました。一般的な投稿の話ではありますが、またカスタム投稿などジャンルを広げていければと思います。


オトナ帝国では、昔のゲームなどの懐かしい体験ができる秘密基地を運営中。
浅草葦拠点では現在セールを実施しています。お部屋の詳細だけでも見てください~

詳細を見る


関連記事

人気記事

最新記事

カテゴリーから記事を探す