where is iframe code defined in wordpress plugin integration?

rw1 · March 2013

hello,

i'm wanting to add rounded corners to the iframe that contains the embedded vanilla forum in a wordpress integration scenario (using the embeddable theme as well).

in firebug i can see that the iframe has what appears to be hardocded styles in it ie:

<iframe width="100%" scrolling="no" height="1000" frameborder="0" style="width: 100%; height: 600px; border: 0px none; display: block;" border="0" src="***" name="vanillaxxxxx" id="vanillaxxxxx"></iframe>

can anyone please tell me where i can hardcode the additional style of border-radius: 10px?

thanks very much!

422 · March 2013

if you wrap the iframe in a div, set a border radius to the div, and overflow hidden on the iframe

http://stackoverflow.com/questions/6535217/css-adding-border-radius-to-an-iframe

vrijvlinder · March 2013

It is a Plugin so it would be in the embedvanilla plugin remote.js
almost at the end of the code you will find:

   document.write('< iframe id="vanilla'+id+'" name="vanilla'+id+'" src="'+vanillaUrl(currentPath)+'"'+optStr('height', ' scrolling="no"', '')+' frameborder="0" border="0" width="'+optStr('width', '100%')+'" height="'+optStr('height', 1000)+'" style="width: '+optStr('width', '100%', '%spx')+'; height: '+optStr('height', 1000)+'px; border: 0; display: block;border-radius: 10px;" >< /iframe >');

just add the border radius in there like I did here.

x00 · March 2013

since it is created dynamically anyway you can do this try this trick

jQuery(document).ready(function($){
    $('iframe').livequery(function(){
        var roundedBox = $('<div class="roundedContainer"/>').css({
            'webkit-border-radius': '10px',
            '-moz-border-radius': '10px',
            'border-radius': '10px',
            'width': $(this).width()+'px',
            'height': $(this).height()+'px',
            'overflow': 'hidden'
        });
       $(this).wrap(roundedBox);
    });
});

You will obviously need livequery loaded for it to work. You can substitute iframe#vanilla for iframe if you wan to be specific.

where is iframe code defined in wordpress plugin integration?

Comments