如何将Adsense添加到使用GatsbyJS构建的网站上? [英] How to add Adsense to a website built with GatsbyJS?
问题描述
我想知道应该在哪里添加Google Adsense提供的<script></script>.
他们说要将其添加到<head></head>中，但是在盖茨比，您将头盔命名为<head>.
我还尝试将脚本添加到html.js文件中，该文件位于带有{``}的<head>标签中，以逃避<script>标签，但是它在网站顶部输出了脚本内容. /p>
TL; DR:向基于GatsbyJS构建的网站添加Adsense的最佳方法是什么?
- 我尝试使用反应adsense软件包，但我不知道如何使用与Gatsby一起使用.
- 我尝试将
<script>标记添加到html.js中，但无法编译. - 如果使用
{``}对其进行转义，则会在网站顶部按原样获得脚本.
<head>
<meta charSet="utf-8" />
<meta httpEquiv="x-ua-compatible" content="ie=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
{this.props.headComponents}
{`<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>`}
{` <script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-1540853335472527",
enable_page_level_ads: true
});
</script>
`}
</head>
源:html.js
该网站应该会被Google抓取工具检测到.
感谢Github给出的答案，终于解决了问题:
如果您要添加Adsense:
-
cp .cache/default-html.js src/html.js - 添加脚本，但其中的所有内容均应转义-> {
<some-js-code-here>} - 以我的情况为例:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
{`
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-1540853335472527",
enable_page_level_ads: true
});
`}
</script>
I'd like to know where I should add the <script></script> provided by Google Adsense.
They say to add it into the <head></head>, but in Gatsby you have Helmet as <head>.
I tried also to add the script inside an html.js file where it's located a <head> tag with {``} to escape the <script> tag, but it outputs at the top of the website the script content.
TL;DR: What is the optimal way to add Adsense to a website built with GatsbyJS?
- I've tried to use the react adsense package but I do not understand how to use it with Gatsby.
- I have tried to add the
<script>tag to html.js and it doesn't compile. - If you escape it with
{``}you get the script as is, on top of the website.
<head>
<meta charSet="utf-8" />
<meta httpEquiv="x-ua-compatible" content="ie=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
{this.props.headComponents}
{`<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>`}
{` <script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-1540853335472527",
enable_page_level_ads: true
});
</script>
`}
</head>
source: html.js
The website should get detected by the Google crawlers.
Thanks to an answer given on Github, finally the problem is solved:
If you want to add Adsense:
cp .cache/default-html.js src/html.js- Add the script but everything inside should be escaped -> {
<some-js-code-here>} - In my situation and as an example:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
{`
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-1540853335472527",
enable_page_level_ads: true
});
`}
</script>
这篇关于如何将Adsense添加到使用GatsbyJS构建的网站上?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
