Multiple Slick Black Boxes IMVU iFrame Layout (No Background)

NOTE 1: This is a bit of a complicated layout and would be best used for people who understand HTML. This is because there are multiple things going on, one iFrame and 5 DIVs (panels/boxes – six if you include the iFrame, but we’re not :P), I shall go through them one by one:

1: MAIN_PANEL: This is where the iFrame goes.
2: TOP_LEFT_PANEL: Updates/blog
3: TOP_RIGHT_PANEL: Welcome message/contact info/mini info box
4: BOTTOM_PANEL: Designed for new products, but can easily be used for music player or other.
5: SCROLL: Scrolling message/ticker
6: AVATAR_IMAGE: Avatar image

Now, before we go any further, those descriptions are just how I imagined them to be used. If you do not want a music player in the bottom panel – you don’t have to, rather have a sticker there instead? Go ahead! Feel free to use the panels however you want :)

If you want to see how I filled in a similar layout to this to give you an idea what this layout might look like if done 100%, here’s an old dummy I made.

NOTE 2: Regarding AVATAR_IMAGE, you just gotta copy and paste the URL of your avatar image/display picture over this URL:, but it MUST be 160×220 – the size determined by IMVU.

NOTE 3: This layout also has something else different about it – it has ‘Add Me’ and ‘Block’ buttons! That means if your visitors want to add you as a contact/friend or block you, all they gotta do is hit one of those buttons and they’ve either added you or blocked you! All you’ll have to do to make the buttons work correctly is add your username or IMVU USER ID in where the code asks and that means the guest_ part too if you are one :)

NOTE 4: The screen shot above shows this layout with a black background, but this layout has NO background to it. I took it with a black background as that is how I designed it and how I think it looks best. But I made this layout with no background so you can freely add your own in. To do that, find the bit of code that says “background-image:url(http://ENTER BACKGROUND URL HERE);” it should be very near the top. Then paste the URL of your background over “http://ENTER BACKGROUND URL HERE” – and you’re done!

NOTE 5: Talking about backgrounds, the layout image is slightly transparent/see-through, 10% to be exact. This mean whatever background you use will show slightly through the layout. Now, that may sound bad but I did this deliberately as it looked really nice – just try it! :)

NOTE 6: This is a fast loading layout (The main layout image is 18.73 kB, compare that to this layout where the background is 200.69kb and the main layout image is 120.48kb). Perfect for people with slow internet connections.

Remember to FIRST read this page BEFORE you try and install an iFrame layout!