サイトトップに固定ページと新着/更新一覧を表示する方法｜WordPress
WordPressで構築されたサイトのトップに
・管理画面上で作成し、更新可能な固定ページコンテンツ
・投稿したエントリーや、各固定ページの新着/更新記事一覧を
・トップページ用に用意した専用のテンプレート
で表示させる方法です。
完成のイメージ
こんな感じを目指します。
ヘッダー、フッター、サイドバーについては今回は触れません。
1.サイトトップ用の固定ページを作成
管理画面の「固定ページ」 > 「新規作成」を選択し、トップページに表示させたいコンテンツを作成しましょう。
一般的にはご挨拶だったり、サービスの内容だったりですね。
2.サイトトップ用のテンプレートを用意
スクラッチで作っても良いですが、今回は現在お使いのテーマにあるであろうテンプレートの一つであるpage.phpを流用して説明していきます。
まずはpage.phpをコピーして、ファイル名をfront-page.phpとしましょう。
これはWordPressのバージョン3.0以降から有効なテンプレートなのですが、このファイル名でテーマファイルディレクトリにアップロードすると、自動的にサイトトップのテンプレートに指定されるようになります。
3.サイトトップ用のテンプレートを編集
それではこのfornt-page.phpを編集していきます。
現在お使いのテンプレートにあったpage.phpによっては若干記述が異なることもありますが、基本的には
<div id="container"> …… </div>
もしくは
<div id="content"> …… </div>
の……の部分に
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php the_content(); ?>
<?php endwhile; ?>
<?php endif; ?>
<?php
$posts = get_posts('numberposts=10&post_type=any&orderby=modified&exclude=1');
if ($posts) {
?>
<ul>
<?php foreach($posts as $post): setup_postdata($post); ?>
<li><?php the_modified_date(); ?>|<?php the_modified_time(); ?>|<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>
</ul>
<?php
}
?>
と記述します。
4.コードの簡単な説明
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php the_content(); ?>
<?php endwhile; ?>
<?php endif; ?>
これは指定した固定ページを出力するコードです。ループ内の
<?php the_content(); ?>
が、実際に出力する部分を指定していますが、もちろん他のタグを入れても出力できます。
例）
<?php the_title(); ?> - 記事のタイトルを表示 <?php the_date(); ?> - 記事の投稿日時を表示
また、「指定した」という部分ですが、今の段階では先ほど作成した固定ページはまだサイトトップに表示されるように「指定」はされていません。
この後やりますので、今のところは「指定する」ということだけ頭に入れておいてください。
<?php
$posts = get_posts('numberposts=10&post_type=any&orderby=modified&exclude=1');
if ($posts) {
?>
<ul>
<?php foreach($posts as $post): setup_postdata($post); ?>
<li><?php the_modified_date(); ?>|<?php the_modified_time(); ?>|<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>
</ul>
<?php
}
?>
こちらのコードで新着/更新一覧を出力しています。
$posts = get_posts('numberposts=10&post_type=any&orderby=modified&exclude=1');
get_posts()関数で、一覧で抽出するデータの種類や数を指定します。
numberposts – 取得する一覧の数を指定。ここでは10個を表示。
post_type – 表示する一覧の種類を指定。投稿のみ、固定ページのみの表示も可能。ここでは両方を表示。
orderby – 表示順番の指定。作成日順、更新日順、各種ID別等、ランダムなんてのも。ここでは更新日順。
exclude – 表示したくない投稿のIDを指定できます。テスト用の投稿などを指定しておきましょう。
他にも沢山のパラメータが指定できます。詳細は
テンプレートタグ/get posts – WordPress Codex 日本語版
をご覧ください。
<?php the_modified_date(); ?>|<?php the_modified_time(); ?>|<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
表示するhtmlを出力するコードです。
<?php the_modified_date(); ?>（更新日）|<?php the_modified_time(); ?>（更新時間）|<a href="<?php the_permalink(); ?>"><?php the_title(); ?>（リンク付きタイトル）</a>
となり、実際には
「 2011年1月1日|6:01 PM|ほげほげしました 」というように表示されます。
もちろんこのタグも編集できますので、「更新日」じゃなくて「作成日」だったり、「カテゴリ」を追加するのも可能です。
ファイルができたらお使いのテーマファイルディレクトリにアップロードしてください。
5.サイトトップに表示させる固定ページを指定
それでは最初に作成した固定ページを、サイトトップに表示させるように設定します。
「設定」 > 「表示設定」 > 「フロントページの表示」で、デフォルトで選択されている「最新の投稿」から、
「固定ページ（以下を選択）」に変更しましょう。
そして、フロントページとして選択できるプルダウンから、最初に作成した固定ページのタイトルを選択してください。
これで完了
以上の作業で全て完了です。まとめですが、出力までの流れとしては
・front-page.phpを作成したことで、サイトトップのテンプレートには既存のindex.phpではなくfornt-page.phpが適用される
・front-page.phpには固定ページのコンテンツが表示されるコードを書いている
・5.の作業により、その固定ページはサイトトップ用に作成したものが使われる
・同じくfront-page.phpには新着/更新一覧を表示するコードも書かれているので、指定されたパラメータに基づき一覧が出力される
というようになります。
