Simple GA4 Rankingでサイトにアクセスランキングを表示させる方法まとめ

このサイト・および記事にはアフィリエイト広告を利用しています。

サイトの軽量化を図るため、Google Analyticsのデータに基づきアクセスランキングを表示するプラグイン「Simple GA4 Ranking」を使った設定方法のまとめです。

大枠はこちらのサイトに記載されています。

しかし、「Simple GA4 Ranking」がまだβ版であり、Git Hubから持ってこなければいけない、設定途中のエラー対応などがありましたので、まとめています。

なお、この記事では文字のみでの表示方法となります。
サムネイルや順位数の表示まで行いたい場合は次の記事もご参考になさってください。

完成イメージ

完成イメージは下記となります。

設定完了後のイメージ

できればサムネイルも表示したいところですが、ちょっと大変そうなので、とりあえず記事のタイトル文字のみの表示になります。

Simple GA4 RankingをGit Hubからインストールする

Universal Analyticsのサービス終了に伴い、Simple GA Rankingでは動作しないため、Simple GA4 Rankingを使用します。

しかし、Simple GA4 Rankingはβ版のため、WordPressの通常のプラグインの画面では検索してもヒットしません。

  1. WordPressのメニューにある、「Add New from GitHub」をタップ
  2. Git Hubの「Simple GA4 Ranking」のアドレスを入力
  3. 「今すぐインストール」をクリック

Git Hubからインストールする方法は使っているWordPressのサービスによって違うかもしれません。

手順1.「Add New from GitHub」
手順2・3

Google Analyticsの設定をする

Universal AnalyticsからGoogle Analyticsへの移行がお済みでない場合は、下記などを参考に移行を行ってください。

  1. Google AnalyticsのプロパティからプロパティIDをコピーする
  2.  Google Cloud の Google API Library  (https://console.cloud.google.com/apis/library/analyticsdata.googleapis.com ) へアクセスする
  3.  「Google Analytics Data API」を有効化する
  4.  「認証情報」の「CREATE CREDENTIALS」 をクリック→「OAuthクライアント ID」を選択
  5. OAuthクライアント ID をセットアップする
  • アプリケーションの種類:ウェブアプリケーション
  • 名前:(任意)Simple GA4 Ranking など
  • URL1:アクセスランキングを表示させたいサイトのURL
  • 承認済みのリダイレクトURL:(後で設定)
  1. 「作成」をクリック
  2.  「Client ID」、「Client Secret」をコピーする
手順1.プロパティID
手順3.Data APIの有効化
手順4.OAuthクライアント IDを選択
手順5.OAuthクライアント IDのセットアップ
手順6・7.作成完了

WordPressの設定をする

  1. WordPress の管理画面から [設定] → [ Google 認証] を表示する
  2. クライアントID・クライアントシークレットを入力(「Google Analyticsの設定をする」の7.)
  3. プロパティIDを入力(「Google Analyticsの設定をする」の1.)
  4. 「変更を保存」をクリック
  5. API認証の「認証する」をクリック
WP設定

エラーが出た時

私の場合、ここでエラーが出ました。

「このアプリはGoogle の OAuth 2.0ポリシーを遵守していないため、ログインできません。」というエラーでした。

OAuth2.0エラー

エラー文に表示された「https://~(flowName=GeneralOAuthFlowの前まで)」をコピーし、上記「Google Analyticsの設定をする」の5.の「承認済みのリダイレクトURL」に貼り付けます。

コピーしたURLを貼り付け

WordPressの設定に戻り、API認証の「認証する」を再びクリックすると、エラーは出ず、アクセストークンが発行され、設定完了です。

エラーなし

表示したい場所にショートコードを設置

私の場合はサイドバーに表示したかったので、

  1. WordPressの管理画面→「外観」→「ウィジェット」
  2. 表示させたい場所にブロックを追加→「ショートコード」→下記を記入

ショートコード

[sga_ranking]

なお、「アクセスランキング」というタイトル文字はブロック選択からHeadを選択して表示させています。

表示完了!となりました。

サムネイル・順位数表示に対応した記事はこちら

文字だけの表示だと少し寂しいので、サムネイルを表示させました。
ただ、サムネイルを表示させると順位数の表示が消えてしまったので、その対応も合わせて行った記事はこちらです。

Shifterの場合はジェネレート時のランキング表示

私はShifterという静的WordPressサービスを利用しています。

通常はサイトがダウンしている状態なので、表示されているランキングはユーザーがサイトを訪問した時点のものではなく、Shifterでジェネレートした時点のもの、ということになります。

私の場合は毎日のようにサイトを更新し、Shifterをジェネレートしているので、特に問題ないという判断です。

サイト運営・お仕事に関するその他の記事

◆またまたお金にならんことをガチでやってしまった…💧貧乏暇なし…!今度はikumado紹介動画を編集してみました。

Youtubeプロジェクトでご一緒しているTAKA(石原孝尚)監督とランチ!何かもう全然宇宙人すぎて脳内バグりまくりだったけど、何かできることやりたくなった件!

◆久々にお仕事でやっちまった…!失敗がデカすぎてリカバリーに相当時間かかるので、日常の中で粛々と対応しようと若干「諦め」の境地でようやく切り替えられた件!

◆ブログ運営はもう立派な趣味だ!と思うので、サイトが毎月月末数日表示されなくなるのを、プランをアップグレード(利用料増額)して解決した!件

◆プラグイン「EWWW Image Optimizer」を使ってサイトをWebP化!作業中にストレージが爆増したので、プラグイン「File Manager Advanced」を使って「EWWW Image Optimizer」が作った不要画像を全削除で対応した!ようやく転送量も削減できた件!

◆今更SEO対策でURLスラッグをちょこちょこ変えてます!プラグイン「Redirection」を使って301対策したけど、内部リンクは手直し中…!😱

◆やっとできた!WebP化して費用節約しようとしたらストレージ爆増でサイトダウンした原因追及&対策!!月$20も節約できるぞー!

◆WebP化して料金を下げようと思ったのに逆にストレージ容量爆増してやっぱりダウングレードできなかったけど、何とか解決策を探っています!

◆最近ブログ更新が滞りがちなのは、ikumado worksでのお仕事で「Happy First」YouTubeプロジェクトで頑張ってるから。今までの経験をフル活用してます♪

◆保育園の先生へのビデオメッセージを全部無料ソフトで編集!Canva・Microsoft Designer&CapCut&DOVA-SYNDROME使用(サンプルをYouTubeで公開中!

◆Adsenseを利用しているとGoogleから求められる「税法上の居住地における追加の税務情報が必要です」はシンガポール宛&郵便番号記載の居住者証明書でようやく解決した記事

◆Simple GA4 Rankingでサイトにアクセスランキングを表示させる方法まとめ

◆Simple GA4 Rankingでサイトにアクセスランキングをサムネイル・順位数も表示させる方法まとめ

◆ikumadoのPromadoのお仕事でプロジェクトメンバーにCanva教えたことに「ありがとう」と言われてめっちゃ嬉しかった件!

◆SSL証明書の期限切れはWordPressのホスティングサービスから新たに払い出されたドメイン検証レコードをAWSのRoute53に追記して解決した

◆普段から使いまくっているnotionがフリープランでも総容量無制限だと知って驚愕したので、これからもたくさん使っていこうと思った記事

◆いつもお世話になっているikumadoと共同で運営しているikumado×保活メンターサービスのLPをnotionを使って作ってみた記事

◆バリューコマースのアフィリエイトが訳わからんすぎて、「ヨメレバ」・「カエレバ」も使ってみた・バリューコマースならサイトに設置するタグはプラグインで設置してみた記事

◆バリューコマースのアフィリエイトで初!売上:1,029円を受け取れる!と思ったら口座名相違でやっぱり一発でうまくいかなかった(🤣)件

◆フリーランスで加入しているフリーランス保険では福利厚生(WELBOX)が使える!エアコンクリーニングはおそうじ革命さんの会員割引が利用できて、3台で6,594円もお得になった!

◆外のお仕事10時~17時でやってたら、自分の作業時間が全然なくて、発想転換して子どもの寝かしつけで一緒に寝て3時30分起きにしたら2時間作れた!