61

I've noticed that Google's remarketing code inserts an iframe at the bottom of my page. The problem is that the iframe messes up my layout (it's 13px high and leaves a blank white vertical space at the bottom).

I've tried to hide it with css but it's still visible in IE9:

iframe[name='google_conversion_frame'] { 
    height: 0 !important; 
    line-height: 0 !important; 
    font-size: 0 !important; 
}

Therefore I've got two questions:

a) how to hide this iframe in IE9

b) most importantly - is it safe or can it somehow affect the functionality of this script?

4

9 回答 9

141

在我的网站中,我使用此代码

iframe[name='google_conversion_frame'] { 
    height: 0 !important;
    width: 0 !important; 
    line-height: 0 !important; 
    font-size: 0 !important;
    margin-top: -13px;
    float: left;
}

浮动 iframe 允许您使用等于 iframe 内主体高度的负边距。

于 2013-09-03T09:09:07.987 回答
31

其他方法(在上面的评论中提到)是将conversion.js 脚本标签插入隐藏的div:

<div style="display: none">
    <script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">  </script>
</div>

来源:http : //keanrichmond.com/google-remarketing-messing-with-my-design.html

于 2013-09-03T10:54:01.843 回答
22

我有同样的问题。好的解决方案是在 google 再营销标签中添加一行。

    var google_conversion_format = 3;

修改前的标签:

<!-- Code Google de la balise de remarketing -->
<script type="text/javascript">/* 
<![CDATA[ */
var google_conversion_id = 10xxxxxxxx;
var google_custom_params = window.google_tag_params;
var google_remarketing_only = true;
/* ]]> */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js"></script>
<noscript><div style="display:inline;"><img height="1" width="1" style="border-style:none;" alt="" src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/10xxxxxxxx/?value=0&amp;guid=ON&amp;script=0"/></div></noscript>

修改后的标签:

<!-- Code Google de la balise de remarketing -->
<script type="text/javascript">/* 
<![CDATA[ */
var google_conversion_id = 10xxxxxxxx;
var google_custom_params = window.google_tag_params;
var google_remarketing_only = true;

var google_conversion_format = 3; /* ADD THIS LINE TO RESOLVE YOUR PROBLEM */

/* ]]> */

于 2014-04-09T13:39:34.450 回答
17

不要使用那些过于复杂的答案。只需position:fixed;在该元素上使用即可将其从文档流中取出。

像这样:

iframe[name="google_conversion_frame"]{
    position:fixed;
}

而已!您保留所有原始功能并且不必担心 API 更改。

于 2016-04-21T19:14:58.883 回答
3

将 iframe 设置为绝对定位是否有任何缺点。

iframe[name='google_conversion_frame'] {
    position: absolute;     
    bottom: 0;
}

更少的代码,没有!重要的,没有显示:无

于 2015-02-04T15:37:10.010 回答
2

这是我的超级简单的缩小解决方案:

/* Hide AdWords Remarketing iFrame */
iframe[name="google_conversion_frame"]{display:block; height:0;}

我测试过,它可以在 Chrome、FireFox 和 IE 10 中运行。

当然,有几种方法可以隐藏它,但为什么没有其他选择。

于 2015-06-30T16:23:33.510 回答
0
iframe[name="google_conversion_frame"] {
  height: 0;
  padding: 0;
  margin: 0;
  display: block;
}
于 2015-04-30T14:21:34.567 回答
0

我添加了“边框:无;” 因为我的网站自动插入了一个边框,即使在折叠时也会显示颜色。

/* Hide AdWords Remarketing iFrame */
iframe[name="google_conversion_frame"] {
  height: 0;
  padding: 0;
  margin: 0;
  border: none;
  display: block;
}

于 2015-11-17T13:35:26.327 回答
0

我只是使用 css 将高度和宽度设置为零。将conversion.js 文件包裹在一个带有id 的div 周围,并将其子iframe 的宽度和高度设置为0。

<div id="googleiframe">
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
</div>
<style type="text/css">
#googleiframe iframe{height:0;width:0;}
 </style>

您可以在主 css 文件中设置样式。

于 2016-02-10T15:07:18.317 回答