最新版【Site Kit】インストールから連携設定方法

雑記


どうもこんばんわ
先日GoogleからWordpressにインストールして、Analytics、Adsense、Search Console、Page Insightsのデータを見ることが出来るプラグイン【Site Kit】が発表されました。
現在は開発者レビューということで正式リリースはされていませんが、インストールすることはできます。

Googleさんが開発したプラグインですし、様々なデータを一括で閲覧できるため是非とも入れておきたいところです。
ベータ版ではありますが私も早速インストールしてみました。

ということで今回は、「Site Kit」のインストールから各サービスの連携設定までを紹介します。

インストール

まずはGoogle Site Kitの公式ページからプラグインをダウンロードしてきます。
ダウンロードはこちらから

サイト内の【Get Developer Beta】ボタンからプラグインをダウンロードすることが出来ます。
※ダウンロードファイルの名前は「google-site-kit.zip」です。

sitekitinstall-1

 

ダウンロードしたファイルをWordpressのプラグインインストール画面からアップロードして、インストールを行います。

sitekitinstall-3

sitekitinstall-2

 

インストールが完了したらいつものように「プラグインの有効化」を押して、使えるようにしてください。
これでインストールは終了です。

初期設定

Create Client ID

インストールが完了したら続いて初期設定を行います。
プラグインを有効化すると以下の画像のような「Welcome文章」が出てきます。文章内の【START SETUP】を押下します。

sitekitinstall-4

初めにGoogle Site Kitを利用する為にクライアントコンフィグレーションを設定用のテキストボックスが表示されます。
ここに入力するテキストは、同じ画面内の「developers.google.com/web/sitekit」にアクセスすることで取得できます。
※URLはユーザー毎に異なっている為、このURLをコピーしてアクセスしても上手く設定できない可能性があります。

sitekitinstall-5

 

既にGoogleアカウントにログインしていれば、そのアカウントに紐づいてSite Kit用の設定情報が表示されます。

ワンポイントもし違うアカウントと紐づけたい場合(Googleアカウントごとに管理サイトを分けている等)は、アカウントを切り替えてください。

sitekitinstall-6

 

後は「GET OAUTH CREDENTIALS」を押下することで、設定用のテキストを取得することが出来ます。

メッセージボックスで設定用のテキストが表示されますので、コピーしてWordpress画面に戻り、テキストボックス内にペーストして「PROCEED」を押して、「Create Client ID」に緑のチェックが入れば設定は完了です。

sitekitinstall-8

sitekitinstall-9

sitekitinstall-10

Search Console連携設定

続いては「Site Kit」を使用するサイトの認証を行います。
Site Kitのセットアップ画面内の「SIGN IN WITH GOOGLE」を押下して、Search Consoleの認証を行います。

sitekitinstall-15

 

Googleのアカウントを指定する画面が出てきたら、Search Consoleで使用しているGoogleアカウントを選択します。

sitekitinstall-11

 

Site KitにSearch Consoleのデータ連携を許可するかどうかのポップアップが出てくるので、すべて「許可」を選択してください。
全て許可を押し、認証が成功するとWordpressのSite Kitセットアップ画面に戻り、すべての設定が完了します。

sitekitinstall-13

sitekitinstall-14

ワンポイント全ての設定項目に緑のチェックが入れば完了です。

「GO TH DASHBOARD」でSite Kitのトップ画面に遷移します。これでSearch Console連携は完了です。

sitekitinstall-15

Adsense連携設定

続いてはGoogle Adsense連携設定を行います。GoogleAdsenseを利用していない場合は飛ばしてください。

Site Kitのダッシュボード画面上「Adsense」のConnect Serviceをクリックしてください。

sitekitinstall-16

 

※ない場合は、WordpressメニューバーのSite Kit⇒SettingsからCONNECT MORE SERVICEタブから各サービスの「Set Up (サービス名)」をクリックすることで連携が出来ます。

sitekitinstall-19

 

 

Search Console連携設定と同じく、アカウントを選択する画面が出てきますので、Adsenseを利用しているGoogleアカウントを選択してください。
選択後、Search Console連携設定と同じくデータ連携許可確認画面がポップアップで何回か出てきますので、すべて「許可」をクリックしてください。

その後自動的にSite Kit側へアカウントの確認が行われ、正常に完了すれば連携設定は完了です。

sitekitinstall-17

ワンポイント私は何回か遭遇したのですが、Site Kitがアカウントの確認を行う過程で画面が真っ白になることがありました。
※以下の画像参照
sitekitinstall-18
しかしダッシュボードを確認してみると、連携設定は完了しており、データも表示されていましたから、処理自体は完了しているようです。

Analytics連携設定

続いてはGoogle Analytics連携設定を行います。Google Analyticsを利用していない場合は飛ばしてください。

Site Kitのダッシュボード画面上「Analytics」のConnect Serviceをクリックしてください。

sitekitinstall-16

 

Site Kitの画面上で「Unverified App Screen」と表示されますが、そのままPROCEEDをクリックしてください。

sitekitinstall-20

 

ブラウザにGoogle Chormeを利用している場合は、途中で「このアプリは確認されていません」と表示されます。
その際は、表示下部の「詳細」をクリックして、安全でないページに移動をクリックしてください。

sitekitinstall-21

sitekitinstall-22

その後はSearch Console連携設定を同じく、アカウントを選択する画面が出てきますので、Analyticsを利用しているGoogleアカウントを選択してしてください。
選択後、Search Console連携設定と同じくデータ連携許可確認画面がポップアップで何回か出てききますので、すべて「許可」をクリックしてください。

その後自動的にSite Kitの画面に戻り、アカウントの確認が行われた後、Analyticsで使用しているビューの選択画面が出てきます。

sitekitinstall-23

利用したビューを選択して「CONFIGURE ANALYTICS」を押下して設定は完了です。

PageSpeed Insights連携設定

続いてはPageSpeed Insights連携設定を行います。

PageSpeed Insightsは、データ連携というよりは、APIを通じてサイトの速度を取得するといった形態になります。
Site Kitのダッシュボード画面上「PageSpeed Insights」のConnect Serviceをクリックします。

sitekitinstall-16

APIを入力する画面が表示されます。しかし現時点ではAPIキーが分かりませんので、同じ画面内の「developers.google.com/web/sitekit/apikey」をクリックしてAPIキー発行画面に遷移してください。

sitekitinstall-24

 

遷移先で【GET API KEY】をクリックするとポップアップでAPIキーが発行されます。

sitekitinstall-25

 

あとは表示されたAPIキーをコピーして、Site Kit画面内のAPIキー入力画面にペーストし、「PROCEED」をクリックすることで設定は完了です。

sitekitinstall-26

sitekitinstall-27

こんな感じでデータが見れる

一通りの設定が終われば、Site Kitのダッシュボード画面上である程度のデータが表示されます。
※サイトデータになりますのでモザイク多めになります。ご了承ください。

sitekitinstall-28

sitekitinstall-29

sitekitinstall-30

 

それぞれのデータから各サービスへもアクセスできますので、ブラウザのタブを開いたままキープする必要がないのは助かりますね。

おわりに

以上でSite Kitの設定は完了です。
そのほか必要に応じて「Optimize」や「Tag Manager」との連携設定も可能です。

今まではそれぞれのサービスにそれぞれアクセスしなければなりませんでしたが、Site Kitを利用することで一括でデータにアクセスすることが出来ますので非常に便利ですね。
現在はベータ版なので、不具合などが出る可能性がありますが、使ってみる価値はあるでしょう。

 

[PR]健康系ブログ始めました!!

健康系ブログを始めました。
まだまだ始めたばかりですが、見に来てね!!

[PR]壁にくっつく?画期的スマホケースが話題

磁石も両面テープも使わない!?
平らな面であればどこでもくっつくスマホケースがあるって知ってました?
これを使えば簡単に自撮りが出来て、より映えた写真が撮れるかも!?
詳しくはコチラ→自撮りユーザー必見!どこでもくっつくスマホケースとは?


雑記

Posted by K.A