I want to add Google AdWords to my site but the script I'm supposed to add creates an iframe in the dom. This iframe is visible and moves down 13px (its height) all my page.
Is there any way to avoid this? If not, can I hide it without affecting Google AdWords functionality? (It is an empty iframe).
There's an easy fix that doesn't affect the functionality of the code snippet. I've done this with no adverse effects. Just place the script within a hidden div like below and it should do the trick:
<div style="display:none"> <script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js"> </script> </div> @Mario is correct that there is a setting that will allow you to turn this display off. However, this setting doesn't seem to exist on the Google UI for remarketing tags, even though they do display this iframe (I think this is a bug on Google's end, as I imagine the "google_remarketing_only = true" flag was supposed to turn this iframe off and isn't working correctly).
I found out that you can also set this in the tracking JS by manually adding the flag "google_conversion_format = 3", like so:
<script type="text/javascript"> /* <![CDATA[ */ var google_conversion_id = 0123456789, google_conversion_label = "XXXXXXXX", google_custom_params = window.google_tag_params, google_remarketing_only = true, google_conversion_format = 3; /* ]]> */ </script> <script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js"></script> This might be easier that regenerating the tags for some people, and solves the problem in the case that the UI doesn't support setting this option when generating the tags.
I normally add this CSS(3) rule to the stylesheet:
iframe[name=google_conversion_frame] { display: none !important; } Hope it helps.
you can also set max-height: 0; instead of display:none; Not sure of implications of display none on the iframe. This works back to ie6.
iframe[name="google_conversion_frame"] { display: block; max-height: 0; } The best and simplest solution that I have come across for this issue is simply to remove the frame from the document flow by adding the following code to the css stylesheet:
iframe[name="google_conversion_frame"]{ position:fixed; } Hope this helps