Javascript Google Adsense 错误“TagError:adsbygoogle.push() 错误:没有可用宽度 = 0 的插槽大小”

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/33465168/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 15:05:41  来源:igfitidea点击:

Google Adsense Error "TagError: adsbygoogle.push() error: No slot size for availableWidth=0 "

javascriptcss

提问by Raag Singh

I'm using responsive Google Ads on my website but unfortunately it is not working all the time and most of time it is returning

我在我的网站上使用了响应式 Google Ads,但不幸的是它并没有一直工作,而且大部分时间它都在返回

TagError: adsbygoogle.push() error: No slot size for availableWidth=0

TagError:adsbygoogle.push() 错误:没有可用宽度 = 0 的插槽大小

I tried to fix the issue by defining the Ad Sizes but still the issue is not resolved yet.

我尝试通过定义广告尺寸来解决该问题,但问题仍未解决。

.adslot_1 { width: 320px; height: 100px; }
@media (min-width:500px) { .adslot_1 { width: 468px; height: 60px; } }
@media (min-width:800px) { .adslot_1 { width: 728px; height: 90px; } }
@media only screen and (min-width:800px)and (max-width:3000px) {
    #topbanner {
        width: 640px;
        height: 90px;
    }
}

Well, this is the actual Google Adsense Google Code that I've used (for security reasons I've remove pub-id and ad-slot.)

嗯,这是我使用的实际 Google Adsense Google 代码(出于安全原因,我删除了 pub-id 和 ad-slot。)

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- articles(auto) -->
<ins class="adsbygoogle adslot_1"
     style="display:inline-block;"
     data-ad-client="ca-pub-[MY_AD_ID]"
     data-ad-slot="AD_SLOT_NOS"
     data-ad-format="rectangle, horizontal"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

采纳答案by Sorin C

I used:

我用了:

window.onload = function() {
    (adsbygoogle = window.adsbygoogle || []).push({});
}

My site was loading pages in a special way, making heavy use of AJAX, so it had to be this way. Hope this helps someone.

我的网站以一种特殊的方式加载页面,大量使用 AJAX,所以它必须是这种方式。希望这可以帮助某人。

EDIT 2018:I feel like I should mention now that the preferred way to do this would be with window.addEventListener( 'load', ... ), instead of the old method of window.onload = ...

编辑 2018:我觉得我现在应该提一下,这样做的首选方法是使用window.addEventListener( 'load', ... ),而不是旧的方法window.onload = ...

回答by Alex

In our case, we had problem displaying two banners but only in Chrome. First banner would not show and it would generate error:

在我们的例子中,我们在显示两个横幅时遇到了问题,但仅限于 Chrome。第一个横幅不会显示,它会产生错误:

No slot size for availableWidth=0

没有可用宽度 = 0 的插槽大小

The second banner would be displayed OK. The problem was not happening in Safari or Firefox. Trying to fix the problem via CSS didn't help.

第二个横幅将正常显示。问题在 Safari 或 Firefox 中没有发生。试图通过 CSS 解决问题没有帮助。

We solved the problem by changing the:

我们通过更改以下内容解决了问题:

(adsbygoogle = window.adsbygoogle || []).push({})

to

$(document).ready(function(){(adsbygoogle = window.adsbygoogle || []).push({})})

jQuery is required for above method.

上述方法需要jQuery。

回答by Emerson Thompson

You need to remove the others that are not visible, how I use (jQuery):

您需要删除其他不可见的,我如何使用(jQuery):

$(document).ready(function(){
  var $analyticsOff = $('.adsbygoogle:hidden');
  var $analyticsOn = $('.adsbygoogle:visible');

  $analyticsOff.each(function() {
    $(this).remove();
  });
  $analyticsOn.each(function() {
    (adsbygoogle = window.adsbygoogle || []).push({});
  });
});

回答by Raheel Hasan

I solved it using setTimeout as the issue is that the GA code its not picking the size of the parent on its default loading.

我使用 setTimeout 解决了它,因为问题是 GA 代码在默认加载时没有选择父级的大小。

setTimeout(function(){(adsbygoogle = window.adsbygoogle || []).push({})}, 1000);

setTimeout(function(){(adsbygoogle = window.adsbygoogle || []).push({})}, 1000);

回答by m.spyratos

1.Make sure that the DOM is ready when pushing the ad.

1.推送广告时确保DOM已准备好。

Vanilla (Modern browsers only)

Vanilla(仅限现代浏览器)

document.addEventListener("DOMContentLoaded", function() {
    (adsbygoogle = window.adsbygoogle || []).push({});
});

In jQuery

在 jQuery 中

$(document).ready(function(){
    (adsbygoogle = window.adsbygoogle || []).push({});
});

In Angular

在角度

$timeout(function () {
    (adsbygoogle = window.adsbygoogle || []).push({});
});

2.Make sure the number of ads you have on the page is correct.

2.确保页面上的广告数量正确。

  • Total number of ads does not exceed google's limit, which is 3ads per page. Advertising and other paid promotional material added to your pages should not exceed your content, per Google's new policy.
  • Number of ads pushed to adsbygooglecorresponds to the number of ads you have on page.
  • 广告总数不超过 google 的限制,即每页3 个广告。根据Google 的新政策,添加到您网页上的广告和其他付费宣传材料不应超出您的内容。
  • 推送到的广告数量adsbygoogle对应于您在页面上的广告数量。

3.For responsive units, add width and height.

3.对于响应式单元,添加宽度和高度。

Responsive ad unitsneed a width and a height specified on the inselement. You could do something like this:

自适应广告单元需要在ins元素上指定宽度和高度。你可以这样做:

ins {
    min-width: 300px;
    min-height: 50px;
}

回答by trudesign

Where is your parent container? You are supposed to set width and height on the parent I think, not the actual <ins>tag.

你的父容器在哪里?我认为您应该在父级上设置宽度和高度,而不是实际<ins>标签。

回答by Tanya Gupta

One possible reason is that you are styling the div that contains the ad unit using a framework that creates a conflict in size specification. In my case I was using bootstrap styling which messed up my ad display.

一个可能的原因是您正在使用会在尺寸规范中产生冲突的框架对包含广告单元的 div 进行样式设置。就我而言,我使用了引导程序样式,这弄乱了我的广告显示。

<div id="ad1" class="row">
<!-- ad code-->
</div>

This did not work. Once I removed it:

这没有用。一旦我删除它:

<div id="ad1">
<!--ad code-->
</div>

it worked fine

它工作正常

回答by frafor

It's been all day that I've tried to find a solution to the error, and I'd like to thank @Emerson Thompson for his solution!

我一整天都在试图找到错误的解决方案,我要感谢@Emerson Thompson 的解决方案!

On one environment I'm working in, I depend on the Ad Inserter Pro for WordPressplugin. It turns out that the plugin prints the HTML for all the layouts (mobile and desktop). With viewport width as a criterion, it then hides some using CSS.

在我工作的一种环境中,我依赖Ad Inserter Pro for WordPress插件。事实证明,该插件会为所有布局(移动和桌面)打印 HTML。以视口宽度为标准,然后使用 CSS 隐藏一些。

When adsbygoogle.jsfinds a hidden ad, it throws the TagError: adsbygoogle.push() error: No slot size for availableWidth=0exception blocking subsequent javascript execution.

adsbygoogle.js发现隐藏的广告时,它会抛出TagError: adsbygoogle.push() error: No slot size for availableWidth=0异常阻止后续 javascript 执行。

Be sure to check your ad visibility before to initialize them.

在初始化它们之前,请务必检查您的广告可见性。

回答by Mike P. Sinn

If you're using angular-google-adsense, you need to remove the ad-formattag from your adsense html block;

如果您使用的是angular-google-adsense,则需要ad-format从您的 adsense html 块中删除标签;

Wrong:

错误的:

<adsense 
ad-client="ca-pub-2427218021515520" 
ad-slot="5093178896" 
inline-style="display:inline-block;width:100%;" 
ad-format="auto">

Right:

对:

<adsense 
ad-client="ca-pub-2427218021515520" 
ad-slot="5093178896" 
inline-style="display:inline-block;width:100%;">

回答by Matt Parkins

I found modifying the ins tag to remove the data-ad-format attribute solved the error for me:

我发现修改 ins 标签以删除 data-ad-format 属性为我解决了错误:

<ins class="adsbygoogle adslot_1"
 style="display:inline-block;"
 data-ad-client="ca-pub-[MY_AD_ID]"
 data-ad-slot="AD_SLOT_NOS"></ins>