Blog Documentation Book a Demo
Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

[Solved] Transparent background with new embed feature.

JiveDigJiveDig
edited August 2011 in Vanilla 2.0 - 2.8
As the title states, is there a way to make the background of the forum transparent so it can use my websites background image/color?

I'm not a big developer so i don't know much about code, but an option like this would be great. Then we'd only need to change the font and colors of the forum to match our website.

Tagged:

Comments

  • JiveDigJiveDig
    anybody?
    if it's code related - any help pointing me in the right direction would help.
    Thanks.
  • therobtherob New
    edited April 2011
    Bump
    Hey @JiveDig

    Did you find a solution to this? My forum is fine in firefox but in IE it gives itself an opaque white background...

    Thanks
  • JiveDigJiveDig
    I haven't.

    Can you link me to your forum?

    I haven't tried since i posted this. I got swamped with work so that site build got put on hold.

    I'm still very curious as any time i use the embed feature I would want it transparent, since i usually have some sort of textured backgrounds in my sites.
  • therobtherob New
    @JiveDig - sent you a PM
  • therobtherob New
    Ok got it - as with all my fixes (hacks) they aren't upgrade proof but if you go to plugins/embedvanilla/remote.js and edit the following line (around 139):

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

    add the allowTransparency="true" attribute to it so that it looks like this

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

    then it works in IE.

    Not sure why at any point anyone would want a defaulted white background (whether on a white site or not) maybe @mark and the guys can implement this in the next update of the embed plugin?

    hope this helps
    R
  • JiveDigJiveDig
    I got it to work using strictly CSS. I've learned a lot since this original post ;)

    www.thestiz.com/forums
    www.tenttalk.com
  • UnderDogUnderDog MVP
    I got it to work using strictly CSS
    Please show us how you did it, or show a piece of code.

    There was an error rendering this rich post.

  • JiveDigJiveDig
    There were a few things that needed it. . . and they were in 2 different css files. . . surprisingly and annoyingly.

    First vanilla/applications/dashboard/design/style.css

    body { color: #000; font-family: 'lucida grande','Lucida Sans Unicode', tahoma, sans-serif; font-size: 75%; line-height: 1.7em; background: transparent; margin: 0; padding: 0; text-align: center; font-size: small; }

    was a main one.

    The others were in

    vanilla/themes/EmbedFriendly/design/custom.css
    I used the developer tools in Rapidweaver to find the css classes i needed. You could use Firebug in Firefox to do the same.

    My biggest concern/fear is when it's time to update Vanilla or the theme.
Sign In or Register to comment.