とっちゃん@nyanco! です。
今回はPinterest(ピンタレスト)みたいなWordPress無料テーマ「Fukasawa」のトップページ記事をランダム表示にカスタマイズできたよというお話です。
先日書いた下記記事の【解決編】となります。
紆余曲折ありましたが、解決した結果だけ知りたい方は目次から【解決】の項へどうぞ。
ちなみに「Fukasawa」以外のテーマでも共通で使える方法ですにゃ~
非推奨の「query_posts」を使わずランダム表示できた!と思ったら…
前回記事ではWordPresで推奨されてないテンプレートタグ「query_posts」を使ってとりあえずランダム表示させてました。
が、別の方法を模索すること半日ほど。
こちらのサイト様の記事を参考にして見よう見まねで記述した下記コードでランダム表示が実現できました!!
....
<?php if ( have_posts() ) : ?>
<div class="posts" id="posts">
<?php
$args = array('orderby' => rand);
$q = new WP_Query( $args );
if ( $q->have_posts() ) : while ( $q->have_posts() ) : $q->the_post();
$template_part_name = get_post_type() == 'post' ? get_post_format() : get_post_type();
get_template_part( 'content', $template_part_name );
endwhile; endif; wp_reset_postdata();
?>
</div><!-- .posts -->
<?php get_template_part( 'pagination' ); ?>
....
※「index.php」の61〜68行目(テーマのバージョンによっては異なるかも)です。
「query_posts」の代わりに「WP_Query」を使ったモダンな記述方法とのこと。
非推奨のテンプレートタグは使わずにランダム表示出来て、これで一件落着ですにゃ〜
…と思ったのも束の間、ふと他のページ(カテゴリー一覧ページ)に行ってみると。。
カテゴリー一覧ページなのにカテゴリー関係なくランダム表示されている…!
つまり前回記事の「難あり」と同じ状態です…
どうもトップページ以外にも影響がある記述になってしまっているようで。
やはり付け焼き刃程度の知識ではどうにもならないのか…と疲れてしまい、そのまま数日放置してましたが、日を改めて再度チャレンジしてみたところ、呆気なく解決!
【解決】TOPページの記事をランダム表示する方法
早速ですが、解決に至ったコードはこちら。
<?php
function home_random_posts( $query ) {
if ( $query->is_home() && $query->is_main_query() ) {
$query->set( 'orderby', 'rand' );
}
}
add_action( 'pre_get_posts', 'home_random_posts' );
// 呼び出しの指定
add_shortcode("getCategoryArticle", "getCatItems");
?>
このたった数行を「子テーマ」の「functions.php」に貼り付けるだけ!
これだけで「トップページだけ」をランダム表示させることができるようになりました。
前回記事と本記事で色々いじった「index.php」は元に戻す必要があるので、親テーマフォルダからコピーして戻しておきます。
解決に導いてくれたのは下記サイト様の記事です、ありがとうございます!

おわりに
ちなみに本記事でTOPページの記事をランダム表示させるようにしたのは、筆者運営の下記サイトです(見るタイミングによってはランダム表示ではない時もあるかも知れませんが)。
それにしても、WordPressはやっぱり難しいですね…
WordPress関連の記事はたくさんヒットするものの、書いてあることが理解し切れないことも多く、まだまだ精進が足りないと痛感した出来事でございました。
本記事がどなたかの参考になれば幸いです。
今回は以上となります。
最後まで読んでいただきましてありがとうございました!
それではまた〜✧٩(ˊωˋ*)و✧
コメント
はじめまして!
fukasawaポートフォリオサイトを作っておりトップページの投稿をランダムに表示することをしたいのですが、解決に至ったコードをfunctions.phpに張り付けると
「wp-content/themes/fukasawa-child/functions.php ファイルの6行目のエラーのため、PHP コードの変更をロールバックしました。修正し、もう一度保存してください。
syntax error, unexpected ‘<', expecting end of file」
と表示されてしまいます…
ご教授いただければ幸いです。
はじめまして、コメントありがとうございます!
ご不便おかけしてすみません、、
下記コードに置き換えてもう一度試していただけますか?
is_home() && $query->is_main_query() ) {
$query->set( ‘orderby’, ‘rand’ );
}
}
add_action( ‘pre_get_posts’, ‘home_random_posts’ );
function getCatItems() {
// カテゴリ記事を取得する処理
}
add_shortcode( ‘getCategoryArticle’, ‘getCatItems’ );
?>