Question

Media.net Ads提供了两个脚本来放置网站的标头和标头。对于头部标签-

<script type="text/javascript">
window._mNHandle = window._mNHandle || {};
window._mNHandle.queue = window._mNHandle.queue || [];
medianet_versionId = "XXXXXXX";
</script>
<script src="//contextual.media.net/dmedianet.js?cid=XXXXXXX" async="async"></script>

对于“身体”标签-

<div id="XXXXXXXXX">
<script type="text/javascript">
try {
window._mNHandle.queue.push(function (){
window._mNDetails.loadTag("XXXXXXXXX", "300x250", "XXXXXXXX");
});
}
catch (error) {}
</script>
</div>

我制造了这样的组件

import React from "react"
import { Helmet } from "react-helmet"

const Ads = () => {
  return (
    <div className="adsDiv">
       <Helmet>
        <script
          type="text/javascript"
          dangerouslySetInnerHTML={{
            __html: `
window._mNHandle = window._mNHandle || {};
window._mNHandle.queue = window._mNHandle.queue || [];
medianet_versionId = "XXXXXX";
            `,
          }}
        />
        <script
          src="https://contextual.media.net/dmedianet.js?cid=XXXXXXXX"
          async="async"
        />
      </Helmet>
      <div style={{ textAlign: "center" }} id="XXXXXXXX">
        <script
          type="text/javascript"
          dangerouslySetInnerHTML={{
            __html: `
try {
window._mNHandle.queue.push(function (){window._mNDetails.loadTag("XXXXXXXX", "300x250", "XXXXXXXX");});
}
catch (error) {};`,
          }}
        />
      </div>
    </div>
  )
}

不起作用，我没有看到任何广告，在控制台问题中，该链接已被chrome SameSite cookie的新更新所阻止，我不知道该怎么办，有人可以帮忙吗？

Answer 1

我建议您不要将脚本添加到html.js文件中。您需要将head标签插入每个页面的全局上下文中，因此我建议您在html.js文件中进行操作，然后可以随时添加body标签。如果正文脚本也将出现在每个页面上，建议您也将其添加到html.js文件中。

这是完成此操作的详细方法html.js documentation

Answer 2

我将head标签的代码放在gatsby-ssr.js中，它将被注入到每个页面内的全局上下文中，如下所示：

const React = require("react")

const HeadComponents = [
  <script
    key="1-head-ads"
    dangerouslySetInnerHTML={{
      __html: `
            window._mNHandle = window._mNHandle || {};
            window._mNHandle.queue = window._mNHandle.queue || [];
            medianet_versionId = "XXXXXXX";
            `,
    }}
  />,
  <script
    key="1-http-ads"
    src="//contextual.media.net/dmedianet.js?cid=XXXXXXXX"
    async
  />,
]

exports.onRenderBody = ({ setHeadComponents }, pluginOptions) => {
  setHeadComponents(HeadComponents)
}

然后为body标签的代码创建一个像这样的组件

function MedianetADS({ divId, size }) {
  React.useEffect(() => {
    if (typeof window !== "undefined") {
      try {
        window._mNHandle.queue.push(function () {
          window._mNDetails.loadTag(divId, size, divId)
        })
      } catch (error) {}
    }
  }, [divId, size])

  return <div id={divId} />
}

然后，您要将ADS添加到任何地方，只需像这样导入组件

 <MedianetTag size="728x90" divId="XXXXXXXX" />

另一种方法，您可以在html.js中添加ADS的代码，该代码也可以使用。您可以将head标签的代码添加到head标签中，并将body标签的代码添加到html.js body标签中，或者像“ MedianetADS”上方的此组件一样添加，然后导入到所需的任何页面。

如何在盖茨比网站上展示广告？

2 个答案: