特定のカスタムフィールドにフックして記事をランダム表示させる方法

スポンサーリンク

今回は任意の記事をランダム表示させるWordPressカスタマイズを紹介します。自分がオススメしたいという記事や、ソーシャルで注目を集めた記事だけを見せたいという場合にとっても便利ですよ。

カテゴリやタグをベースにせず、カスタムフィールドを使っていきます。

Double Spiral with Random Outgrowth 1Double Spiral with Random Outgrowth 1 Photo by ehsanul

当ブログでは記事エリアの上に、特定記事をランダム表示させるようにしていますが、もともとはjavascriptを使って実装していました。

これはこれで良かったといえば良かったのですが、手動で記事を追加していくのがやや面倒くさかったんですね。
1件の記事を追加するのに、記事のタイトル、URL、アイキャッチ画像のパスを書き足す必要がありました。

また、記事件数が増える分だけ当然jsファイルの容量も大きくなるので、読み込み速度にも影響が出てしまいます。

そんなわけでこれをPHPに置き換えることにしました。

記事の絞り込みをカスタムフィールドで

さて、PHPで実装するにあたってできるだけ記事の追加・削除を簡便化させるというのが前提にあります。となると、何かしらの方法で記事を抽出してしまうのがベストですよね。

抽出方法として、最初にカテゴリやタグを利用することを考えました。
しかし、カテゴリの場合はそもそも抽出したい記事に設定されているカテゴリがバラバラ。かといってそのためだけにカテゴリを新設するのもアホですし、SEO的にもちと微妙じゃなかろうかと。

またタグもかなりの数がすでにある中で、それ用のタグを作るというのもなんだか微妙です。

そこで目を付けたのがWordPressのカスタムフィールド。
カスタムフィールドであれば追加が容易にできますし、抽出対象外にしたい記事が出てきたら、その記事に設定したカスタムフィールドを削除すればいいだけ。管理もしやすいですよね。

というわけで、以下がそのコードになります。

実装するコード

<ul> <?php $featured = get_posts( array ( 'meta_query' => array (array( 'key' => 'Featured', 'value' => '1' )), 'posts_per_page' => 3, 'orderby' => 'rand' )); foreach($featured as $post): setup_postdata($post); ?> <li><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?><p><?php the_title(); ?></p></a></li> <?php endforeach; wp_reset_postdata(); ?> </ul>

このコードをテンプレートの任意の箇所に追加すればOK。

meta_queryで抽出対象になるカスタムフィールドの名前をkeyに入れて、valueに抽出する値を入れます。
これで抽出された対象記事をランダムに3件分引っ張ってきて、ループで件数分表示させるようにしているだけというお手軽なやり方です。

keyvalue、表示件数、ループで出力するHTMLはお好みで変更してください。

あとは記事の編集画面に行き、keyに設定した文字列のカスタムフィールドを作成、値にvalueで設定した値を追加してやれば、その記事が抽出対象となります。


当ブログではjsからこのコードに置き換えて運用していますが、jsと違ってサクリと表示させることができますし、動作もまったく変わらないので、もっと早くに変更しておけばよかったなぁと思いましたよ。
今更ながらカスタムフィールドはいろいろ便利ですなー。

「Hacks」新着記事

カスタムブロックを追加するなら「Block Lab」プラグインを導入すると幸せかもしれない

Avatar for ホシナ カズキ

ホシナ カズキ

「Password Checkup」がChromeユーザーのセキュリティを守ってくれるかもしれない

Avatar for ホシナ カズキ

ホシナ カズキ

Facebookアプリで3D写真投稿機能をONにするには? 試してみたら本当にできた件

Avatar for ホシナ カズキ

ホシナ カズキ

Twitterアプリに搭載されたデータセーブ機能をONにする方法

Avatar for ホシナ カズキ

ホシナ カズキ

大規模・広範囲にわたるクラッキングによるWordPress改ざん事案が発生中

Avatar for ホシナ カズキ

ホシナ カズキ

もっと見る

モバデビモバイルウェブのネタ、ニュースMaciPhoneなどのApple関連、WordPressのことなど、いろいろ書く雑食系ブログメディア。
ためになるかもしれないし、ならないかもしれない。そこそこ更新してますそこそこ。

このブログについてもっと詳しく