WordPressで記事一覧ページを作る
- 2018/7/10
- CMS
WordPressでサイトを運営していて、
記事が多くなっていて記事一覧が欲しいと思ったことはありませんか?
WordPressのテーマの中には事前に記事一覧用のテンプレートが作られているものもありますが、
一覧を作るがためににテーマをごっそり変える気にはならないと思います。
なければ作ってしまおうということで、記事一覧用のテンプレートの作り方を説明します。
まずは、記事の取得から
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
処理を記述
<?php endwhile; ?>
<?php else ?>
記事がなかった時の記述
<?php endif; ?>
これで記事があったらその下のwhileを記事の数だけ繰り返して一覧を作成します。
記事が1つもなかったらelse内の処理を実行するというなんとも簡単な仕組みです。
では次に記事の情報の取得について説明します。
まずはリンクですね。これがなきゃ記事見えません
先ほどのwhileループ内に
<a href=”<php the_permalink() ?>”> </a>
これが各記事へのリンクになります。
タイトルとかアイキャッチ画像とかをこれで囲えば、
一覧の記事から記事をクリックして記事詳細を見るというプロセスが出来上がります。
後は適宣必要な情報をループ内に書いていけばOKです。よく書く記述を下に書いておきます。
・サムネイル(アイキャッチの取得)
<?php if (has_post_thumbnail()){
the_post_thumbnail();
} ?>
・投稿日付
<?php the_time ?>
・タイトル
<?php the_title?>
・記事内の文章を表示するけど、一定の文字数だけ表示する(…とか続きを読むとかのやつ)
<?php
echo ‘<p>’;
if(mb_strlen($post->post_content, ‘UTF-8’) > 100{
$content = str_replace(‘¥n’, ”, mb_substr(strip_tags($pist->post_content), 0, 100, ‘UTF-8’));
echo $content . ‘…<a href=”‘ . get_permalink() . ‘”‘>続きを読む</a>
} else{
echo str_replace(‘¥n’, ”, strip_tags($post->post_content));
}
echo ‘</p>’;
?>
3行目の100ってところと4行目の後ろの100ってところが一覧に表示する文字数なので、そこを変えて都合のいい文字数にしてください。
やってみると意外と簡単です。
是非、ご活用ください。