[Option to Add custom Class to IMG tag on banner]

12 hours ago, andrewatfornax said:

I think you've self-answered this in one of the numerous places you've posted the same question.

I still think Revive could allow optional field for adding custom class when setting up a new banner. Flexibility!

Surely, I'll give contribution when I have money (maybe in some months).

Congratulations for the Revive Adserver. Thanks!

[How to add a Class to IMG tag on image banner?]

SOLVED! Now I'm using the "Javascript Tag" Invocation Code (instead of Asynchronous Javascript Tag) serving Responsive and Centered image.

Just put the invocation code inside a DIV and added a piece of code in the end only for the addClass purpose, THIS WAY:

<div class="mydiv">

//INVOCATION CODE (I added "async" inside script tag hoping it to work asyncly, despit not being the Async invocation code)

<!-- Revive Adserver Javascript Tag - Generated with Revive Adserver v4.1.0-rc1 -->
<script async type='text/javascript'><!--//<![CDATA[
   var m3_u = (location.protocol=='https:'?'https://example.com.br/adserver/www/delivery/ajs.php':'http://example.com.br/adserver/www/delivery/ajs.php');
   var m3_r = Math.floor(Math.random()*99999999999);
   if (!document.MAX_used) document.MAX_used = ',';
   document.write ("<scr"+"ipt type='text/javascript' src='"+m3_u);
   document.write ("?zoneid=1");
   document.write ('&amp;cb=' + m3_r);
   if (document.MAX_used != ',') document.write ("&amp;exclude=" + document.MAX_used);
   document.write (document.charset ? '&amp;charset='+document.charset : (document.characterSet ? '&amp;charset='+document.characterSet : ''));
   document.write ("&amp;loc=" + escape(window.location));
   if (document.referrer) document.write ("&amp;referer=" + escape(document.referrer));
   if (document.context) document.write ("&context=" + escape(document.context));
   if (document.mmm_fo) document.write ("&amp;mmm_fo=1");
   document.write ("'><\/scr"+"ipt>");
   

//HERE IS THE SIMPLE CODE to add two Bootstrap classes on the image: make image Responsive and horizontally Centered.

   $(document).ready(function () {
        var img = $('.mydiv').contents().find('img').addClass('img-responsive center-block');
            });    //END

//]]>--></script><noscript><a href='http://example.com.br/adserver/www/delivery/ck.php?n=a1389b42&amp;cb=INSERT_RANDOM_NUMBER_HERE' target='_blank'><img src='http://example.com.br/adserver/www/delivery/avw.php?zoneid=1&amp;cb=INSERT_RANDOM_NUMBER_HERE&amp;n=a1389b42' border='0' alt='' /></a></noscript>
    
    
</div>    

[Responsive Image banner]

SOLVED! Now I'm using the "Javascript Tag" Invocation Code (instead of Asynchronous Javascript Tag) serving Responsive and Centered image.

Just put the invocation code inside a DIV and added a piece of code in the end only for the addClass purpose, THIS WAY:

<div class="mydiv">

//INVOCATION CODE (I added "async" inside script tag hoping it to work asyncly, despit not being the Async invocation code)

<!-- Revive Adserver Javascript Tag - Generated with Revive Adserver v4.1.0-rc1 -->
<script async type='text/javascript'><!--//<![CDATA[
   var m3_u = (location.protocol=='https:'?'https://example.com.br/adserver/www/delivery/ajs.php':'http://example.com.br/adserver/www/delivery/ajs.php');
   var m3_r = Math.floor(Math.random()*99999999999);
   if (!document.MAX_used) document.MAX_used = ',';
   document.write ("<scr"+"ipt type='text/javascript' src='"+m3_u);
   document.write ("?zoneid=1");
   document.write ('&amp;cb=' + m3_r);
   if (document.MAX_used != ',') document.write ("&amp;exclude=" + document.MAX_used);
   document.write (document.charset ? '&amp;charset='+document.charset : (document.characterSet ? '&amp;charset='+document.characterSet : ''));
   document.write ("&amp;loc=" + escape(window.location));
   if (document.referrer) document.write ("&amp;referer=" + escape(document.referrer));
   if (document.context) document.write ("&context=" + escape(document.context));
   if (document.mmm_fo) document.write ("&amp;mmm_fo=1");
   document.write ("'><\/scr"+"ipt>");
   

//HERE IS THE SIMPLE CODE to add two Bootstrap classes on the image: make image Responsive and horizontally Centered.

   $(document).ready(function () {
        var img = $('.mydiv').contents().find('img').addClass('img-responsive center-block');
            });    //END

//]]>--></script><noscript><a href='http://example.com.br/adserver/www/delivery/ck.php?n=a1389b42&amp;cb=INSERT_RANDOM_NUMBER_HERE' target='_blank'><img src='http://example.com.br/adserver/www/delivery/avw.php?zoneid=1&amp;cb=INSERT_RANDOM_NUMBER_HERE&amp;n=a1389b42' border='0' alt='' /></a></noscript>
    
    
</div>    

[How to add a Class to IMG tag on image banner?]

Hi! Please, what file should I edit so Revive output images (img tag) with some added class atribute by default?

I need to add "img-responsive" class atribute (from bootstrap) to make my image banner responsive.

Already tried javascript, but it seems can't find that img element generated by Revive. Thanks!

[Responsive Image banner]

This is how I'm calling my ads and trying to add "img-responsive" class to the IMG tag, but it is not working.

This works for any other DIV in my page, except for that containing the banner image (div someclass).

 

<div class="someclass">

<ins data-revive-zoneid="1" data-revive-target="_blank" data-revive-id="e5fe80ecb449da9c1d387597aabef1d3"></ins>
<script src="//example.com/adserver/www/delivery/asyncjs.php"></script>

</div>

<script>
$(document).ready(function () {
         var img = $('.someclass').find('img');     //if I change '.someclass' to '.container', every image in my page accept the new class, except the banner image
         $(img).addClass('img-responsive');     // eg: twitter bootstrap
      });
</script>

Why I can't add new class JUST for the banner img with this code?

[Responsive Image banner]

Hi! I see that by simply adding "img-responsive" class to image tag (img) on my banner makes the image responsive.

This is because I use bootstrap and "img-responsive" is a bootstrap class which makes images responsive.

Please, what Revive file should I edit to output images with "img-responsive" class by default?

Best regards,

Eric

[Can we create responsive ad?]

On 05/08/2017 at 12:39 AM, Manish Kumar said:

We need our ad to be responsive. Can this will be possible?

I see that by simply adding "img-responsive" class to image tag on my banner makes the image responsive.

This is because I use bootstrap and "img-responsive" is a bootstrap class which makes images responsive.

But I still don't know a way to output banner images with that class added by default.. Do you know how?

[Option to Add custom Class to IMG tag on banner]

Hi! I see that by simply adding "img-responsive" class to image tag on my banner makes the image responsive.

This is because I use bootstrap and "img-responsive" is a bootstrap class which makes images responsive.

Could Revive include an optional field to add custom class to image tag when adding new banner?

Or what Revive file should I edit to output images with "img-responsive" class by default?

Best regards,

Eric