How to add Adsense to a website built with GatsbyJS? : <p>I'd like to know where I should add the <code>&lt;script&gt;&lt;/script&gt;</code> provided by Google Adsense.</p>

<p>They say to add it into the <code>&lt;head&gt;&lt;/head&gt;</code>, but in Gatsby you have Helmet as <code>&lt;head&gt;</code>.</p>

<p>I tried also to add the script inside an html.js file where it's located a <code>&lt;head&gt;</code> tag with <code>{``}</code> to escape the <code>&lt;script&gt;</code> tag, but it outputs at the top of the website the script content.</p>

<p><strong>TL;DR: What is the optimal way to add Adsense to a website built with GatsbyJS?</strong></p>

<ul>
<li>I've tried to use the <a href="https://www.npmjs.com/package/react-adsense" rel="noreferrer">react adsense package</a> but I do not understand how to use it with Gatsby.</li>
<li>I have tried to add the <code>&lt;script&gt;</code> tag to html.js and it doesn't compile. </li>
<li>If you escape it with <code>{``}</code> you get the script as is, on top of the website.</li>
</ul>

<pre><code>&lt;head&gt;
          &lt;meta charSet="utf-8" /&gt;
          &lt;meta httpEquiv="x-ua-compatible" content="ie=edge" /&gt;
          &lt;meta
            name="viewport"
            content="width=device-width, initial-scale=1, shrink-to-fit=no"
          /&gt;
          {this.props.headComponents}
          {`&lt;script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"&gt;&lt;/script&gt;`}
             {` &lt;script&gt;
                  (adsbygoogle = window.adsbygoogle || []).push({
                    google_ad_client: "ca-pub-1540853335472527",
                    enable_page_level_ads: true
                  });
                &lt;/script&gt; 
              `}
        &lt;/head&gt;
</code></pre>

<p>source: html.js</p>

<p><strong>The website should get detected by the Google crawlers.</strong></p>
