Author Topic: Blog inside an iframe - no background  (Read 6081 times)

Offline hidden

  • Checking the place out
  • *
  • Posts: 8
Blog inside an iframe - no background
« on: January 12, 2009, 04:22:53 PM »
My blog appears inside an iframe on my site. The page is located at h**p://www.harbormall.net/trivani/index_files/TrivaniBlog.htm

When I go directly to my blog h**p://www.trivanihawaii.blogspot.com I have a floral background. When I go to my website and view the blog through the iframe the background is a picture at the bottom of the blog. How do I get my iframe to correctly display the floral background?

The background is placed on the blog via a gadget that allows html code. this is the code:
<style type="text/css">
body {background-image: url("h**p://i342.photobucket.com/albums/o401/Thecutestblogontheblock/aTinRoof.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }
</style>

I already tried making my iframe transparent, it didn't change anything.
Can anyone help me? Thanks.
« Last Edit: January 12, 2009, 04:53:02 PM by Samrc »

Offline hidden

  • Sami
  • Administrator
  • Senior Member
  • *****
  • Posts: 5924
  • Not a geek. Just a Nerd.
    • CSB Tutorials
Re: Blog inside an iframe - no background
« Reply #1 on: January 12, 2009, 04:52:16 PM »
Well... You can't the way you have things set up. 
When you pull a page into an iframe, you lose the background definition of the page shown in the iframe.  So the fact that you have a lovely background on that blog page is lost when you pull it into the iframe.

So you have a choice....where do you want your lovely background to be seen? 
- Directly on the blog site?  Then leave things as they are and decorate your iframe page with border,etc.  But your background image will continue to show under the content of the iframe.
- Or around and through the iframe?  In this case you will have to adjust your codes and where you have your background.  And the blog page will be totally plain, no background to direct visitors.


If you choose the second option, this is how you go about it.  Note that I have not tried this specifically with a blogspot site but since you can control the background image of that page you should not have a problem!

You have 2 pages you must work with to create an iframe.

1) page with the iframe  TrivaniBlog.htm .
This page would have the iframe code calling in your blog. 
The iframe code would have transparency section in the code: ALLOWTRANSPARENCY=TRUE
This page would need the floral background!  You currently have none on this page.  Put your style code pulling in the photobucket image on THIS page, not the blog.

2) your content page (your blog). 
This page would have the 2nd part of the transparency code, which would allow your floral on the iframe page to show through the blog.   
You would put this into the blog page: 
  <style type="text/css"> body {background-color: transparent} </style>
This page would have no background decoration of its own and if you visit the page directly it would be plain white.
But if you see it through the iframe you would see the floral.





(I edited your post to remove direct links to your pages.)   
« Last Edit: January 12, 2009, 07:37:03 PM by Samrc »
-Samantha
TNG: "Sometimes, you can make no mistakes, do everything right, and still lose" - Capt Picard to Data
(:turtle: In memory of Turtle: May 22, 1944 - Nov 24, 2007  GURU, mentor, and really nice guy! :turtleleft: )

Offline hidden

  • Checking the place out
  • *
  • Posts: 8
Re: Blog inside an iframe - no background
« Reply #2 on: January 12, 2009, 06:43:27 PM »
I decided to go with the second option.
I put the background on my web page. I put the ALLOWTRANSPARENCY=TRUE in the iframe. Here is what it looks like:

<p align=left>
<iframe src="h**p://www.trivanihawaii.blogspot.com"
r width="1030" height="100%" marginwidth="0" marginheight="0"
hspace="0" vspace="0" frameborder="0" scrolling=auto>
ALLOWTRANSPARENCY=TRUE
</iframe>

I put the second code in a html gadget on the blog. I could try putting it in the blog html template but I don't know where it goes.

The background doesnt show through the blog... I'm not sure what to try. Any ideas?
« Last Edit: January 12, 2009, 07:35:10 PM by Samrc »

Offline hidden

  • Checking the place out
  • *
  • Posts: 8
Re: Blog inside an iframe - no background
« Reply #3 on: January 12, 2009, 07:20:47 PM »
Oh! I got it to work!   :boogie:
I didn't have the ALLOWTRANSPARENCY=TRUE inside the <> marks... I'm really new at this.

The code I put on the blog is working inside the html gadget.

Thank you for your tutorials and personal help. I would not have figured this out on my own.

Offline hidden

  • Sami
  • Administrator
  • Senior Member
  • *****
  • Posts: 5924
  • Not a geek. Just a Nerd.
    • CSB Tutorials
Re: Blog inside an iframe - no background
« Reply #4 on: January 12, 2009, 07:33:48 PM »
CONGRATULATIONS!   :boogie: :kickdancing: :boogie:

I am very excited for you!!
We all need help with our websites.  Glad to assist.   That's what this site is all about!
-Samantha
TNG: "Sometimes, you can make no mistakes, do everything right, and still lose" - Capt Picard to Data
(:turtle: In memory of Turtle: May 22, 1944 - Nov 24, 2007  GURU, mentor, and really nice guy! :turtleleft: )