Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

タグマネージャーあたりのConsole...
 
共有:
通知
すべてクリア

[解決済] タグマネージャーあたりのConsoleエラーについて

15 投稿
2 ユーザー
3 Reactions
6,027 表示
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

action-impl.js:245

GET https://www.googletagmanager.com/amp.json?id=GTM-*** &gtm.url=https%3A%2F%2F『ドメイン』%2F0-4-7%2F%3Famp%3D1&__amp_source_origin=https%3A%2F%2F『ドメイン』 403 ()

Failed to load https://www.googletagmanager.com/amp.json?id=GTM- ***&gtm.url=https%3A%2F%2F『ドメイン』%2F0-4-7%2F%3Famp%3D1&__amp_source_origin=https%3A%2F%2F『ドメイン』: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://wp-cocoon.com' is therefore not allowed access. The response had HTTP status code 403. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Cocoonでこのようなエラーが幾つか出ていて、Simplicityや寝ログではありませんでした。

私のページだけのエラーかと思って、一応Cocoonのampページでも見ると一緒のエラーが出てました。

って事でよく分かりませんが、ご報告のみしておきますね。

※Chromeシークレットウィンドウ:検証:Consoleで確認しました。

https://wp-cocoon.com/0-4-7/?amp=1


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17391
 

もしかしたら、Googleタグマネージャを利用する場合、AMP用のコンテナを作成し、別々に計測する必要があるのかもしれません。
AMPページにGoogleタグマネージャを実装する方法

Google Analyticsだと同じIDでも休息できるんですが、Googleタグマネージャだと、IDを別にする必要があるってことかも。
Googleタグマネージャ設定項目に、AMP用の計測ID入力欄を作るしかないのか…。

ただ、エラーメッセージを見るとCORS(Cross-Origin Resource Sharing)関係ぽいので、僕も詳しく知らないので、詳しく調べてみないと何とも言えないかもしれません。


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

Googleタグマネージャ設定項目に、AMP用の計測ID入力欄を作るしかないのか…。

AMP対応後のアナリティクス、Google検索からGoogleAMPページのトラフィックが限定されて反映

その場合上記リンク先と類似するかもしれません?

ただコードを入れてみたものの同じエラーが出ているようです。※設定の確認するほどではないと思うんですが、どこか設定ミスがあるかもしれないです。

エラーメッセージを見るとCORS(Cross-Origin Resource Sharing)関係ぽい

う~~ん…、、、なるほど・・・です。昨日もチラっと見たんですが、よく分かりません。。


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17391
 

ただコードを入れてみたものの同じエラーが出ているようです。※設定の確認するほどではないと思うんですが、どこか設定ミスがあるかもしれないです。

これは、HEAD直下とBODY直下に新たなAMP用のタグを挿入したということでしょうか?


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

これは、HEAD直下とBODY直下に新たなAMP用のタグを挿入したということでしょうか?

今朝サイドGTMを再度設定しなおしました。GTMのWebはCocoon設定に設置。GTM:AMP用タグ2つはテンプレートファイルに設置。

amp-header.phpのコード(確認用)

<?php //ユーザーカスタマイズ用
get_template_part('tmp-user/amp-head-insert'); ?>
</head>
<body <?php body_class('amp'); ?> itemscope itemtype="http://schema.org/WebPage">

<?php //AdSense AMP自動広告の<body>直後コード
get_template_part('tmp/ad-amp-auto-adsense-in-body') ?>

<?php //トップに戻るの<body>直後コード
get_template_part('tmp/amp-button-go-to-top-in-body') ?>

<?php //AMP用のGoogle Tag Managerコード
get_template_part('tmp/amp-tagmanager') ?>

<?php //AMP用のAnalyticsコード
get_template_part('tmp/amp-analytics') ?>

<?php //ユーザーカスタマイズ用
get_template_part('tmp-user/amp-body-top-insert'); ?>

head内:/wp-content/themes/cocoon-child-master/

tmp-user/amp-head-insert に挿入

<!-- AMP Analytics --> https://cdn.ampproject.org/v0/amp-analytics-0.1.js 

body内:tmp/amp-body-top-insert.php に挿入

<!-- Google Tag Manager -->
<amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-******&gtm.url=SOURCE_URL" data-credentials="include"></amp-analytics>

アドレス

 https://www.google.co.jp/amp/s/bibabosi-rizumu.com/mobile-responsive/%3famp=1 

 https://bibabosi-rizumu.com/wordpress-top-page-404/?amp=1 

どちらもアナリティクスのリアルタイムでのみ確認したら、アクセス確認できました。

上記リンク 自ドメインURL/?amp=1 の方のみ確認したらConsoleエラーは沢山あります。

 https://www.google.co.jp/amp/s/bibabosi-rizumu.com/パーマリンク/%3famp=1 

からトップのリンク先をクリックして bibabosi-rizumu.com/パーマリンク/ にアクセスした場合、リアルタイム(のみ確認した)では確認できません。※これは正常なのかは、現在わたしには不明事項。

今分かるのはこんな感じです。先日の設定時はhead内とbody内に入れていたけど、トリガーか公開か他?GTM側の設定の何かを忘れていた可能性があります。


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  
https://www.google.co.jp/amp/s/bibabosi-rizumu.com/パーマリンク/%3famp=1

からトップのリンク先をクリックして bibabosi-rizumu.com/パーマリンク/ にアクセスした場合、リアルタイム(のみ確認した)では確認できません。※これは正常なのかは、現在わたしには不明事項。

今。リアルタイムでのみ再度確認したら、www.google.co.jp/amp/s/URL/%3famp=1 からアクセス該当リンク先へのアクセスも確認できました。


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17391
 

今朝サイドGTMを再度設定しなおしました。GTMのWebはCocoon設定に設置。GTM:AMP用タグ2つはテンプレートファイルに設置。

これは、結局「通常ページ」と「AMPページ」では違うGoogleタグマネージャID(GTM ID)を設定したら、うまくいったということでよいのでしょうか?

あと、計測的には、別のGTM IDで計測したトラフィックは、Google Analyticsでアクセス状況見ると、同一ビューでまとめて見ることはできるのでしょうか?


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

結局「通常ページ」と「AMPページ」では違うGoogleタグマネージャID(GTM ID)を設定したら、うまくいったということでよいのでしょうか?

その通りです。1つ『ウェブ』コンテナだけではAMPページのトラッキングが取得ができず、AMPコンテナ用のコードを入れるべき場所に2箇所入れるとどちらも取得できる状態のようです。

リアルタイムで確認した時点で、2重カウントは無かったと思ってます。

計測的には、別のGTM IDで計測したトラフィックは、Google Analyticsでアクセス状況見ると、同一ビューでまとめて見ることはできるのでしょうか?

アナリティクスの同一ビュー画面(:973***34)で『/hoge/?amp=1』と『/hoge/』のアドレス、どちらも確認ができる状態です。


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

追記:

AMPコンテナ用のコードを入れるべき場所に2箇所入れるとどちらも取得できる状態のようです。

入れるべき2つのコード入れたら、Web・AMPのトラッキングはできます。ですがscriptは1つだけにするべきでした。

<script

 async="" custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></

script>

Cocoon側で上記scriptが入っているので、

head内:/wp-content/themes/cocoon-child-master/

tmp-user/amp-head-insert に挿入

<!-- AMP Analytics -->  https://cdn.ampproject.org/v0/amp-analytics-0.1.js  

これは入れちゃダメでした。

サーチコンソールから、近々検索でAMPページができなくなるよ。みたいな事をいわれました。※現在はトラッキングに問題ありません

タグ「amp-analytics extension .js script」がドキュメントで複数回使用されています。これはまもなくエラーとなります。

また現在はAMPエラーにもなってません。いずれなりそうな文言なので、amp-head-insert に入れたスクリプトのみ、今から消しておきますね。

AMP用の計測ID入力欄を作る場合用に一応ご報告します。


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17391
 

その通りです。1つ『ウェブ』コンテナだけではAMPページのトラッキングが取得ができず、AMPコンテナ用のコードを入れるべき場所に2箇所入れるとどちらも取得できる状態のようです。

そしたら、AMPコンテナ用のGTM ID入力項目を新設する必要がありそうですね。

アナリティクスの同一ビュー画面(:973***34)で『/hoge/?amp=1』と『/hoge/』のアドレス、どちらも確認ができる状態です。

それでしたら、申し分ないですね。
GTM IDを別にすると別の画面で表示されるのかと思っていました。
これで心置きなく「AMP用 GTM ID」設定項目を追加できます。

もちろん、コードを二重に出力することなく実装しようと思います。


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

GTM IDを別にすると別の画面で表示されるのかと思っていました。

タグマネージャーの『タグの設定』のところで『トラッキングID』を入れただけですが、同じビューで解析されてますねぇ。

https://wp-cocoon.com/google-tag-manager-id/#toc4

でも結果的に良かったです。AMP化されてるページの確認も同時にできるし、スマホビューの検索流入もわかるので。

宜しくお願いします^^


   
わいひら reacted
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17391
 

タグマネージャーの『タグの設定』のところで『トラッキングID』を入れただけですが、同じビューで解析されてますねぇ。

そうなんですね。すごい…。

一応、機能は追加しておきました。

https://github.com/yhira/cocoon/archive/master.zip

 


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

body内:tmp/amp-body-top-insert.php に挿入していたコードを抜いて、『AMP用 タグマネージャID』にIDをいれました。

さっき行ったばかりですがスマホから、シークレットモードで検索の雷⚡マークから自分のページにアクセスし、現在リアルタイムで確認したら正常に動いています。

念のため明日もチェックしてみますね。


   
かうたっく
(@kautakku)
Illustrious Member Moderator
結合: 7年前
投稿: 4770
トピックスターター  

シークレットモードで/permlink/?amp=1ページから通常ページに切り替えたら、アナリティクスのリアルタイムで/?amp=1ページリンクが消えて通常ページに切り替わるんですね!凄い笑

タグマネージャで何か設定したかもですが??

Googleキャッシュからは切り替わらないとか…、奥が深いです^^

実装ありがとうございました!


   
わいひら reacted
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17391
 

動作確認ありがとうございます!
うまく動作したようで良かったです。
この機能を実装するに当たっては、かうたっくさんの調査がなければ実装に踏み切れなかったと思います。
あらためて御礼申し上げます。


   
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

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