WordPress Simple GA Rankingで記事作成日付表示を追加

2017.10.02

前の記事に続いて、もうひとつ、WordPress関連の話題を。

当Webサイトでは、サイドバーで人気記事ランキングを表示していますが、これはもともとWordPress Popular Postsプラグインを使用していました。
ところが、9月中旬あたりにプラグインのバージョンを4.0系にバージョンアップしたところ、カウントアップしなくなりました。
他の多くのユーザーも同じ現象が発生していたようで、さらにバージョンアップすると復旧したようですが、僕の環境では、最新の4.0.3にバージョンアップしても、設定をいろいろ変えても全くカウントアップしません。

バージョンアップ後は管理画面でのデザインも変わって、カウント数の視認性も悪くなりました。
ということもあり、人気記事ランキングのプラグインは、WordPress Popular PostsからSimple GA Rankingに乗り換えました。

・Simple GA Ranking
http://simple-ga-ranking.org/ja/

WordPress Popular Postsは、カウントデータをWordPressデータと同様にDBに保存しますが、Simple GA Rankingは、Google Analyticsのカウントデータを取得して表示するんですね。
ページアクセスのたびにGoogleにデータを取りに行く分、少しページ表示が遅くなるでしょうが、アクセスのたびにDB書き込みすることがなくなる分、サーバーの負荷がちょっとだけ下がるでしょう。

Google Analyticsのカウントデータ取得には、Google APIの認証情報が必要ですが、その手順はこちらの記事を参考にしました。

・ワードプレスの人気記事表示プラグイン「Simple GA Ranking」の設定とサムネイル表示
http://tabibitojin.com/wordpress-plugin-simple-ga-ranking/

あとは、ウィジェット設定でサイドバーに追加すれば、人気記事ランキングが表示されるようになります。

、、、ところがこのSimple GA Rankingのウィジェット、シンプルという名のとおり、順位とリンク付きタイトルしか表示されません。
技術的な記事については、いつの時点の情報かが重要なポイントですから、少なくともこのサイトにおいては「人気記事ランキング」や「最新記事」の一覧でも、記事作成日付を表示したいです。

ということで、カスタマイズしました。

Simple GA Rankingのオフィシャルサイトにサンプルコードが載っています。

・Simple GA Ranking　関数
http://simple-ga-ranking.org/ja/#function

ここにある
「Sample Code 1 : オーソドックスにランキングを表示させる例です」
をベースに、記事作成日付を追加します。
PHPコードは以下。

<?php
if (function_exists('sga_ranking_get_date')) {
    $ranking_data = sga_ranking_get_date();
    if ( !empty( $ranking_data ) ) {
        echo '<ol>';
        foreach ( $ranking_data as $post_id ) {
            echo '<li><a href="' . esc_attr(get_permalink($post_id)) . '">' . esc_html(get_the_title($post_id)) . '</a>' . '&nbsp;' . '<span style="font-size:14px;color:#d44950">' . get_the_date('Y/m/d', $post_id) . '</span>' . '</li>';
        }
        echo '</ol>';
    }
}
?>

 

サンプルコード7行目に、

'&nbsp;' . '<span style="font-size:14px;color:#d44950">' . get_the_date('Y/m/d', $post_id) . '</span>'

 

↑この部分を挿入しました。

WordPressのget_the_date関数で、記事作成日付を取得しています。
フォントサイズ、フォント色は、同じくサイドバーにある「VK_最新記事」と同じものをspanタグで指定しました。

このコードをそのままウィジェット設定の「テキスト」に追記しても、PHPコードは動作しません。
そのため、ウィジェットでPHPコードを動作させるためのPHP Code Widgetプラグインをインストールし、「PHPコード」ウィジェットに上記PHPコードを貼り付けて保存します。
これで、このページの右サイドバー上部のとおり、ばっちり記事作成日付が表示されるようになりました。

ウィジェットに直接PHPコードを書かずに、CSSとfunctions.phpで対応するのが正解なような気がしますが、自分のサイトですしそこに時間はかけたくないので、僕はこの方法で十分です。

 

タイトルとURLをコピーしました