WordPress Popular Postsのランキングが取得できない！独自テーマ作成時に気をつけたいこと

この記事は最終更新から2年以上が経過しています。情報が古くなっている可能性があります。

このたび初めてまるっとwordpressオリジナルテーマ作成・構築をしていたのですが、「WordPress Popular Posts」でランキングを表示している箇所が何をやっても「まだデータがありません」になってしまう…！！

どうやらこのプラグインは様々な原因からこの事象が発生するようなので、私の場合の原因と解決方法について紹介します。

今回は以下の記事を参考にさせていただきました。

WordPress Popular Postsとは

WordPress Popular Posts(以下wpp)は人気記事をサムネイル付きで表示させることができるプラグインです。

WordPress Popular Posts — WordPress プラグイン

インストール後、ウィジェット画面からこのプラグインをセットし、それを呼び出すごとで簡単にランキングを表示することができます。
他にもショートコードを用いて固定ページ等に表示させたり、phpに直接書いたりすることもできる優れもの！

私の場合、wppを使用して「上位○件の記事からランダムで○件表示」「タグ毎のランキングを表示」を実装しようと思い、phpコードでwppから出力された記事をquery_postsで取得する、という使い方をしようとしていました。

事象

今回①ローカル環境にて構築・検証 ②本番環境へ反映、という流れで行なっていましたが、実はこの工程中で2回この事象にぶつかりました。

1度めは古いバージョンをインストールすることで解決

初めは①ローカル環境での構築中、インストール当初から発生。

wppはアクセスしたら即時そのデータが反映するはずなのに、いくらたっても「まだデータがありません」と出るため調べたところ、現在のバージョンには動作するのに必要なフォルダが欠けているとのこと。

WordPress Popular Postsがsorry. no data so far.になった時の直し方！(2016/11/21)

こちらの記事を元に、インストールしてしまった最新版のwppを削除し、そのフォルダを保有している古いバージョンをインストール。

ちなみにver.2.1.4以前が必要という記事が多かったのですが、こちらの記事にある通りver.2.3.7でも問題ありませんでした。現在ver.2.1.4は公開終了されたようです

その後最新版にアップデートしたところ、データを取り始めたことを確認！(*´∀｀)
それからローカル環境での構築中は、特に問題なく動作していました。

本番環境で再び発生

ローカル環境での構築・検証が終わり、いざ本番環境へ。

上記経験から、最初から古いプラグインをダウンロードし、すぐに最新版にアップデートしました。
本番環境の構築が終わり、テストデータを入れ、ぽちぽちと投稿ページをアクセス…
ところがまた「まだデータがありません」と表示されてしまう！！

設定＞wppの統計情報を[全期間]にして確認しても「まだデータがありません。」と表示されるので、出力に問題があるのではなくそもそも情報の取得が上手くいっていないようでした。

しかしローカル環境と本番環境、違いは本番環境全体(サイトのルートパスから)に丸々かけていたbasic認証くらい。

たくさんある記事を参考にさせてもらい、ひとつひとつ確認しましたがなかなか該当するものが見つかりませんでした。

原因

最終的に該当したのはこちら。

原因はヘッダーに「wp_head()」を記述していないことでした。

wp_head()が無いことでWordPress Popular Postsが動作しなかった理由ですが、
ヘッダーに
<?php wp_head(); ?>
を書くことで
WordPressにインストールしたプラグインのCSSやJSファイルを自動的に読み込んでくれているようです。

参考）WordPress Popular Postsで人気記事が表示されなかった理由(2015/11/7)

wp_head()？
そういえば制御しづらいからと最初の段階で削除して、デフォルトの中身をheader.phpに直書きしてたような…

(ﾟ∀ﾟ)！！？

試しにwp_head()を書いてみると、最初に削除を判断した時よりたくさんのプラグイン関連のcss、jsがでてくるでてくる。
そしてその中にwwpとコメントされているscriptを発見しました。

<!-- WordPress Popular Posts v3.3.4 -->
<script type="text/javascript">

var sampling_active = 0;
var sampling_rate   = 100;
var do_request = false;

if ( !sampling_active ) {
	do_request = true;
} else {
	var num = Math.floor(Math.random() * sampling_rate) + 1;
	do_request = ( 1 === num );
}

if ( do_request ) {

	/* Create XMLHttpRequest object and set variables */
	var xhr = ( window.XMLHttpRequest )
	  ? new XMLHttpRequest()
	  : new ActiveXObject( "Microsoft.XMLHTTP" ),
	url = 'http://ドメイン名/wp/wp-admin/admin-ajax.php',
	params = 'action=update_views_ajax&token=サイト毎の文字列&wpp_id=投稿ページID';
	/* Set request method and target URL */
	xhr.open( "POST", url, true );
	/* Set request header */
	xhr.setRequestHeader( "Content-type", "application/x-www-form-urlencoded" );
	/* Hook into onreadystatechange */
	xhr.onreadystatechange = function() {
		if ( 4 === xhr.readyState && 200 === xhr.status ) {
			if ( window.console && window.console.log ) {
				window.console.log( xhr.responseText );
			}
		}
	};
	/* Send request */
	xhr.send( params );

}

</script>
<!-- End WordPress Popular Posts v3.3.4 -->

こちらのドメイン名とサイト毎の文字列をそれぞれサイト独自の値に、投稿ページIDの部分を<?php echo get_the_ID(); ?>に置き換え、まるっとheader.phpに追加。

ぽちぽちとページを遷移していくと、ちゃんとリアルタイムでランキングに反映・変動していくことが確認できました！

2017/7/28追記
しばらくしてまた取得できなくなったので確認したところ、tokenはサイト毎の文字列ではなくブラウザやアクセス毎に変わる文字列だったようです。

結局、出力制御をfunctions.phpに記述し、上記script文を消してwp_head()をいれることで解決しました！
wp_head()の出力制御で参考にさせて頂いたサイトはこちら。

感想

今回オリジナルテーマ作成が初だったので知りませんでしたが、wp_head()とwp_footer()は独自テーマだからといって抜いてはいけないもののようですね。

「wp_head()からいかに不要な情報を抜くか」という記事が多いので消しちゃえばいいのに！という動機による犯行でしたが、そういう記事が多いということはそれだけwp_head()を書く必要があるということですね…考えが至らなかった

今回はscriptだけ追加し、結局wp_head()を使ってませんが、
wordpress本体や他のプラグインのアップデートによって同原因による不具合が発生する可能性は多いにありそうです。
2017/7/28追記 wp_head()に変更しました。

きっとwordpressのオリジナルテーマを作成している人にとっては常識なんだと思いますが、初心者の方は構築からしっかりwp_head()、wp_footer()を含めた設計をすることを心がけましょう(戒め)

ちなみに上記scriptを追加して解決！となりましたが、wp_head()を書いていないのはローカル環境でも同じこと。
なのに問題なく統計情報がとれていたのは全く不明です。
wp_head()が書いてない場合100%起こるという訳じゃないかもしれませんね。