チュートリアル

あなたのウェブサイトに人気ページランキングを表示するまでの流れを解説します。

1. Google アカウントでサインイン

まずは GA4 をお使いの Google アカウントでサインインしてください。

ポップアップでサインイン画面が表示されるので、サインイン後、Ranklet4 に GA4 へのデータのアクセスを許可してください。

2. 新しいランキングの作成

新しいランキングを追加します。

新しいランキングを作成ボタンを押してください。

ボタンを押してしばらく待つと、ランキングの設定画面に誘導されます。

3. 基本設定と GA4 の設定

ランキングの基本設定と GA4 の設定を行います。

任意のランキングの名称を指定します(例: ブログランキング)。

どの GA4 プロパティからデータを取得するか、集計日数、上位何位まで表示するかを選択します。

設定を変更すると、右側のプレビューが随時更新されます。

ページの絞り込み条件も細かく指定できます。デフォルトでは、トップページ(/)を除外する設定がされています。

プレビューで内容を確認したら、次へボタンを押します。

4. テキストの置換設定

次にテキストの置換設定を行います。

例えば Web ページのタイトルには、Web サイト名も含むことが多くありますが、人気ページランキングには不要です。

このようにデータには含まれているものの、表示上は不要なテキストがあればここで指定します。

置換ルールを設定したら次へボタンを押します。

5. テンプレートの設定

次に人気ページランキングを実際にどのような HTML と CSS で表示するか、テンプレートを設定します。

人気ページランキングの見た目を変更する場合は、HTML および CSS テンプレートを変更し、HTMLテンプレートを変更ボタンを押してプレビューを確認してください。

テンプレートの記述方法について詳しくは テンプレート をご覧ください。

旧 Ranklet からテンプレートを移行される方

旧 Ranklet からランキングを移行する方は、テンプレートエンジンにMustacheを選択してください。

旧 Ranklet の HTML テンプレートと CSS テンプレートをそのまま利用できます。

ただし、Ranklet4 から JavaScript テンプレートは固定となりました。カスタマイズはできませんのでご了承ください。

テンプレートを設定したら次へボタンを押します。

6. 公開と Web ページへの埋め込み

最後にランキングを公開し、Web ページに埋め込みます。

この段階ではまだランキングウィジェットが作成されていないので、ランキング設定を保存・公開ボタンを押してください。

しばらく待つと保存しましたとメッセージが表示されます。

あなたの Web サイトの HTML コードに表示されたランキング表示タグを埋め込むと、その位置に人気ページランキングが表示され、1 日数回の頻度で自動更新されます。

サービスクレジットなしでランキングを表示したい方

Ranklet4 の人気ページランキングには、Ranklet4 のサービスクレジットまたは弊社が選定した広告文が表示されます。

有料プランをご利用いただくと、このサービスクレジットおよび広告文を非表示にできます。

有料プランについては現在、内容を検討中につき、2023 年 12 月 1 日まで無料でご利用になれます。

そちらをご希望の方は、説明をお読みになり、同意してランキング表示タグを確認ボタンを押してください。