GoogleタグマネージャによるJSONの挿入

Question

サイトのテンプレートからHTML要素を動的にプルしようとしています。 {{SCHEMA - Recipe Image}}と{{SCHEMA - Recipe Description}}が正しく動作しません。 {{SCHEMA - Recipe Image}}は正しいセクションを参照していますが、（image.urlの値は有効なURLでなければなりません）をGoogleの構造化データテストツールで返します。解析エラー：何らかの理由では、スキーマのこのタイプでは動作しないために、私は、記事のスキーマを作成したときに働いたと私は9行で

エラー、文字5を与える {{SCHEMA - Recipe Description}}
、。 '}'予想通り

エラーです。
イメージのURLと説明が正しく引き出されない理由を理解できたら助けてください。

<script> 
    (function(){ 
var data = { 
    "@context": "http://schema.org", 
    "@type": "Recipe", 
    "author": "Example", 
    "cookTime": "PT1H", 
    "description": "Generic description goes here.", 
    "image": { 
     "@type": "ImageObject", 
     "url": {{SCHEMA - Recipe Image}} 
    }, 
    "recipeIngredient": [ 
     {{SCHEMA - Recipe Ingredient}} 
    ], 
"name": {{SCHEMA - Recipe Title}}, 
"prepTime": "PT15M", 
"recipeInstructions": {{SCHEMA - Recipe Steps}} 
} 

var script = document.createElement('script'); 
script.type = "application/ld+json"; 
script.innerHTML = JSON.stringify(data); 
document.getElementsByTagName('head')[0].appendChild(script); 
})(document); 
</script> 

Answer 1

カスタム変数{{ SCHEMA - Recipe Image }}のコードを確認できますか？私の最初の考えは、画像の属性値を正しく選択していないということですが、そのコードが表示されていなければわかりません。また、選択しようとしているHTMLを見て参考になるかもしれません。

ただ、参考として、これは私がイメージするためのカスタム変数を正常に実装しました方法です：これはイメージをラッピングされたリンクのhref属性を選択し、あなたのしていることを

function(){ 
var image = document.querySelector(".slide-2 a").getAttribute('href'); 
return image; 
} 

注意HTML構造に応じて、画像の属性を選択する必要があります（src）。

1つの可能性は、イメージを選択した後でイメージを '返す'ことを忘れていることです。

あなたはこれに近い何かをする必要があるかもしれません：

function(){ 
    var image = document.querySelector("img").getAttribute('src'); 
    return image; 
    } 

別の可能な答え：私は最近、私のサイトのためにこれを実装して、私はGoogleの構造化データテストツールがnullなどのカスタム変数を示して持っていましたランダムではありますが、すべてではありません。私はテストツールをリフレッシュし、最終的には正しく表示されるので、バグの可能性があるので、そのツールに100％の信頼を置くことはしません。リフレッシュして、それが役立つかどうか確認してください。

フィールドが実際に入力されているかどうかを確認する唯一の方法は、「Elements」タブのChrome Developer Toolsを開いてControl-Fを押し、「Schema」を検索してGTMによって挿入されたJSONオブジェクトを探します"url":フィールドに実際にURLが入力されているかどうかを確認します。

これで問題が解決しない場合は、さらに詳しい情報を私に提供してください。私はもう一度見ていきたいと思います！