iFrames, What are they... how can they be used?

Talk about HTML resources, styles etc.
Post Reply
CatJammies
web counter beginner
Posts: 2
Joined: Sun Jan 30, 2005 2:29 pm

iFrames, What are they... how can they be used?

Post by CatJammies » Sun Jan 30, 2005 2:41 pm

What exactly is/are iFrames, and how would someone go about using them to accent a web site?

What I want to do: I want to create , lets say for example, an testimonial of a product on several web pages, but do not want to have to write the HTML on ever page.

I just want to: write the code once, but have it viewable on many pages. The same goes for editing this page, I only want to edit one article, but effect all pages that contain this article.

If you know of a HOW TO website that descrives the building of iFrames, please e-mail me.

Thank you
Alexandra
GoStats@CatJammies.com

User avatar
JimBb
Deep Thought
Posts: 1964
Joined: Sun Nov 16, 2003 8:19 pm
Location: Dilbeek, Belgium
Contact:

Re: iFrames, What are they... how can they be used?

Post by JimBb » Sun Jan 30, 2005 3:29 pm

Well, the purpose of a forum is not to start mailing, but to have information here available for you and for anyone else looking for the same information.

Here we go.

You should see an iFrame as a window within your page. A hole through which you look to another page, even another site if you like. So what's the first thing you do?
Define the dimensions

Code: Select all

<iframe width="300" height="200"></iframe>
That will prepare a frame of 300 pixels wide and 200 high. If you prefer to use a relative size in stead of a fixed one, using percentages, that will work too.
Which size to pick? Depends on two things:
  • How big is the page you want to see through that "window"?
  • How big is the "disruption" you allow on your own page?
There are no right or wrong answers, certainly for the second question. Only you can decide.

Okay, what's next?

Define the content
Of course, what's the point of an iframe if you don't show anything through it :)

Code: Select all

<iframe src="http://www.gostats.com" width="300" height="200"></iframe>
Just like with a link, you should add "http://" if you refer to another site, otherwise just give the pagename.

Now let's clean things up a little. Start with leaving some space around the iFrame:

Code: Select all

<iframe src="http://www.gostats.com" width="300" height="200" hspace="5" vspace="8"></iframe>
That will show the same 300x200 frame, but this time the text or images that are right next to the frame "stay away from it": 5 pixels on the left and the right, 8 pixels at the top and the bottom.

By default there is a border around the iframe. If that doesn't suit you, you may want to try the following:

Code: Select all

<iframe src="http://www.gostats.com" width="300" height="200" hspace="5" vspace="8" frameborder="0"></iframe>
Mind you: 'frameborder="0"' is the opposite of 'frameborder="1"'. You just have the choice between a frameborder or no frameborder. 0 and 1 don't indicate the width - 'frameborder="12"' won't give you a thick border.

You'll notice that an iframe behaves like an image. That means you can define the alignment just like with an image, so that for example your text flows nicely around it:

Code: Select all

<iframe src="http://www.gostats.com" width="300" height="200" hspace="5" vspace="8" frameborder="0" align="right"></iframe>
The result of this code is the same 300x200 box, glued to the right margin. Any text will flow around it. In stead of "right" you can use "left" or "middle".

And that's about it.

Jim
Last edited by JimBb on Mon Feb 28, 2005 4:34 pm, edited 3 times in total.

User avatar
rchmura
Site Admin
Posts: 2256
Joined: Sun Oct 05, 2003 9:09 pm

Post by rchmura » Mon Jan 31, 2005 3:52 pm

Alexandra, I noticed that you have GoStats@CatJammies.com listed in your signature. I would like to mention that any email address listed on a web site will most likely be crawled (picked up) by spammers. If your intention was to see if GoStats would send spam to you, then you will most likely find spam but it won't be due to having records in the GoStats database.

Just though I'd point that out. :shock:

CatJammies
web counter beginner
Posts: 2
Joined: Sun Jan 30, 2005 2:29 pm

Thank you

Post by CatJammies » Thu Feb 17, 2005 11:45 pm

Jim, Everything that you offered was VERY helpful. Thank you . And again, thank you for the hint on that leaving email addresses open, might be crawled. Many thanx 8)

alexandra

User avatar
JimBb
Deep Thought
Posts: 1964
Joined: Sun Nov 16, 2003 8:19 pm
Location: Dilbeek, Belgium
Contact:

Re: Thank you

Post by JimBb » Fri Feb 18, 2005 3:05 am

CatJammies wrote:Thank you .
You're welcome :)

Jim

jungleformula
web counter beginner
Posts: 1
Joined: Mon Feb 28, 2005 3:23 pm

Great tutorial

Post by jungleformula » Mon Feb 28, 2005 3:27 pm

I always wondered how people managed to do that. That will be very useful for me with a couple of my sites.

JF.

kenroar
five fingers
Posts: 7
Joined: Mon May 21, 2007 12:04 am

More on iframes

Post by kenroar » Mon May 21, 2007 12:45 am

I use an iframe for the GoStats counter. For example, on the index page at http://www.princetonol.com/groups/iad/ at the bottom, the contact information and counter are actually an iframe located at http://www.princetonol.com/groups/iad/c ... frame.html

The reason it's on an iframe is the copyright year. I have to change it every year and I have about 6,000 pages on that site. I haven't even had time to put the counters on all the pages without iframes.

Ken

User avatar
rchmura
Site Admin
Posts: 2256
Joined: Sun Oct 05, 2003 9:09 pm

Post by rchmura » Tue May 22, 2007 9:25 am

Hi Ken,

The iframe is a great solution. However, I should note that the GoStats counter will not be able to track full referrer information from within an iframe. (You might notice that all your referrers are coming from one url.)

The way to solve that problem is to use a server include (often called server-side include). Depending on your web server setup this will allow you to include your counter inline in your page to better provide referrer tracking.

kenroar
five fingers
Posts: 7
Joined: Mon May 21, 2007 12:04 am

Post by kenroar » Tue May 22, 2007 12:26 pm

I'll ask my host about that. It is still telling me what pages are being visited because the referral page is the page in which the iframe resides on.

Ken
rchmura wrote:Hi Ken,

The iframe is a great solution. However, I should note that the GoStats counter will not be able to track full referrer information from within an iframe. (You might notice that all your referrers are coming from one url.)

The way to solve that problem is to use a server include (often called server-side include). Depending on your web server setup this will allow you to include your counter inline in your page to better provide referrer tracking.

User avatar
rchmura
Site Admin
Posts: 2256
Joined: Sun Oct 05, 2003 9:09 pm

Post by rchmura » Tue May 22, 2007 3:25 pm

Hi Ken,

Yes, it will tell which which page on your site is accessed, however you will lose out on the details of external referrals to your site. (like search engine traffic and links to your site).

Post Reply