560days 電脳備忘録

【Wordpress】ページングしつつランダムに記事を表示させる

「Wordpressで記事をランダムに表示させたい。あ、もちろんページャーは実装してね。」という依頼を受け、早速グーグル先生に問い合わせましたが、記事をランダムに表示するやり方の記載はあるもののページャー(ページ分割)に対応した記事はほぼほぼありませんでした。

多くのサイトで紹介されている方法fだと1ページ目に表示された記事が2ページ目以降にさも当たり前のように表示されてしまうんですよね・・・。結局こちらの記事を参考にして実装することができました。

WordPress 記事をランダムに表示してページングする方法

function.phpに追記。ページングで分割しても記事が重複することなく表示されるようになりました。


<?php
session_name("pgsession");
session_start();
add_filter('posts_orderby', 'edit_posts_orderby');
function edit_posts_orderby( $orderby ) {
	$seed = $_SESSION['pgsession'];
	if (empty($seed)) {
		$seed = rand();
		$_SESSION['pgsession'] = $seed;
	}
	$orderby = 'RAND(' . $seed . ')';
	return $orderby;
}
?>

確かにページ分割しても記事が重複せずに表示されるようになったのですが、この方法だとsessionの値が変わらない限りランダムに並び変わりません。ブラウザをリロードしても何も変わりません・・・。

トップページ(ページャーの1ページ目)に戻った時、トップページでリロードした時に再度記事をランダムに重複することなく表示させるのが仕様です。 そこで、トップページ(ページャーの1ページ目)に戻った時、もしくはトップページでブラウザをリロードした時にsessionを破棄して値を取り直すことで記事の並びを変えることを思いつき、PHPでの実装を試みたのですが、どうやっても記事が重複して表示されてしまい実装できませんでした。

PHPがダメならjQueryでと半ばやけくそでjquery.cookie.jsを使い、トップページへのリンクをクリックした時、もしくはトップページ(ページャーの1ページ目)でリロードした時のみsessionを破棄するようにしたところ、意図した動きをしてくれるようになりました。

jQuery(document).ready(function( $ ) {
$('.go-to-toppage').on('click',function(){
  var sesid = "pgsession";
  $.removeCookie(sesid);
  $.cookie(sesid, null);
  $.cookie(sesid, "", {expires: -1});
  $.cookie(sesid,"",{path:"/",expires:-1});
});

トップページへのリンクをクリックした時にセッションを破棄するようにしました。

<?php $url = $_SERVER['REQUEST_URI'];
  if(strstr($url,'page')==false):
?>
jQuery(document).ready(function( $ ) {
	if (window.performance) {
  	if (performance.navigation.type === 1) {
  var sesid = "pgsession";
  $.removeCookie(sesid);
  $.cookie(sesid, null);
  $.cookie(sesid, "", {expires: -1});
  $.cookie(sesid,"",{path:"/",expires:-1});
  	} 
}
});
<?php endif; ?>

トップページ(1ページ目)でリロードした時のみsessionを破棄するようにしました。ページ分割しているので2ページ目以降はURLに「page」という文字列が含まれますが、1ページ目には表示されないのでこれをトリガーにしています。

PHPとjQueryの合わせ技とスマートな方法ではありませんがなんとか実装できました。本当はPHPで完結したかったんですけどね・・・。

投稿日
カテゴリ ,