Q&A
Mr. Pickles the AdPlugg Pug

Why does adplugg-iframe keep increasing it's height?

+1
0
-1

When creating HTML ad and putting it in zone, this div is constantly increasing. How can I prevent that behaviour?

https://www.dropbox.com/s/81b9mmhouin0mo7/Screenshot%202016-06-13%2015.5...



Answers

+1
1
-1

AdPlugg iFrames are designed to resize to fit the size of their contents (by default).  So if your ad has a fixed size, the AdPlugg tag will stay fixed to the size of the ad.  If your ad's size changes, the AdPlugg tag's size will change to fit the ad. This makes it so that you can have responsive HTML5 ads such as this one.  If you want to control the size of the ad, you can either fix the size of the HTML5 ad's source content so that it is the exact dimensions that you want.  Alternatively you can set the width on the AdPlugg ad tag.  To set the width on your AdPlugg ad tag, add something like the following CSS to your site's stylesheet:

div.adplugg-tag[data-adplugg-zone='testing_html5_ad_v6'] {
    width: 300px; 
}

In the above CSS we are telling the browser to find a div with a class of "adplugg-tag" and a "data-adplugg-zone" attribute of "testing_html5_ad_v6" and to fix its size to 300px.

Additionally, you can fix the size by setting a fixed width on whatever element the AdPlugg ad resides within.  On your site, that would be the <div class="col-md-3 col-sm-12 col-xs-12 aside pull-left"> tag.  Set a fixed with on that element and the AdPlugg ad will be stay bound to the size of its container.

 

+1
0
-1

I do understand the responsive style practice, however, as far as I see, this is functional "bug" of adplugg, because JS is watching the contents of iframe in a loop, which is killing browser in my example.

Please, see attached animated .gif [9MB] below (open in browser to see it working). I recorded, what's happening on the screen.
https://www.dropbox.com/s/77kzabghln7hpjs/acc-head-anim.gif?dl=1

I'm using HTM5 banner created in Google Web Designer. That is not banner oriented bug, because whats happening is infinite.
Is there a way, that calculation of an iframe is not happening every 1/2 second, but on for example "on reload" event?

Thanks for your reply.

Ok, now I get it, sorry. The animation in the ad is a bit odd because it moves the html5 canvas below the bounds of its containing div. This creates the slide effect by having hidden content that is further down the page from the viewable part of the ad. AdPlugg doesn't know that that part of the ad is hidden and thinks the ad is getting taller. We'll work on a fix I'll post back here soon.
Ok, I think the infinite loop is fixed now. Please retry it. In our test environment, AdPlugg wasn't able to properly determine the height of your ad (because of the way the ad's animation works). You may need to set it manually using CSS, for example: div.adplugg-tag[data-adplugg-zone='testing_html5_ad_v6'] iframe {height: 210px;}
Oh yes, oh yes indeed! I did achieved to use a responsive Google Web Designer ad with AdPlugg on a responsive site! Much thanks! Best, MountVacation