iframes on Squidoo - The Whole Story
There is another lens on Squidoo describing how to use IFRAMES on squiddo to include content with formatting and features not allowed by the basic html allowed in Squidoo. It's a good start but doesn't seem to go far enough to help you make the most of iframes in Squidoo, so I am creating this lens to expand on the concept.
In particular the other lens doesn't outline the disadvantages of using iframes and doesn't explain how to work within the limitation of size mentioned. Here I will tell you why to limit the use of iframes, how to set up the page being framed for optimum results, and how to set up the iframe on Squidoo for better viewability.
In particular the other lens doesn't outline the disadvantages of using iframes and doesn't explain how to work within the limitation of size mentioned. Here I will tell you why to limit the use of iframes, how to set up the page being framed for optimum results, and how to set up the iframe on Squidoo for better viewability.
Disadvantages of Iframes
The When And Why To Not Use An iframe
There is one very distinct disadvantage to using an iframe, the content is not crawled by the search engines.
Whether you're using Squidoo to altruistically provide useful information or as a vehicle to market your your skills and services and drive traffic to your web site, you want your lens to be found. The best way to be found is to have your lens show up in the major search engines like Google and Yahoo!.
The only way this will happen is if the search engines can find relevant words in your lens to put in the indexes. Using only iframes for your content hides all of the words from the search engines and you won't get found.
So if you can say what you need to say, and clearly get your message across, using just the formatting provided by Squidoo, don't use an iframe. This will greatly increase your visibility to all searchers, both within Squidoo and to the entire World Wide Web.
Something you need to understand about using an iframe to display content is the content needs to be accessible on the web. You also need to understand that content on the web you did not create belongs to someone else and is copyrighted.
The moral of the story is don't put an iframe around someone else's content unless you ask permission. Framing content is different than linking and is considered a copyright violation.
Whether you're using Squidoo to altruistically provide useful information or as a vehicle to market your your skills and services and drive traffic to your web site, you want your lens to be found. The best way to be found is to have your lens show up in the major search engines like Google and Yahoo!.
The only way this will happen is if the search engines can find relevant words in your lens to put in the indexes. Using only iframes for your content hides all of the words from the search engines and you won't get found.
So if you can say what you need to say, and clearly get your message across, using just the formatting provided by Squidoo, don't use an iframe. This will greatly increase your visibility to all searchers, both within Squidoo and to the entire World Wide Web.
Something you need to understand about using an iframe to display content is the content needs to be accessible on the web. You also need to understand that content on the web you did not create belongs to someone else and is copyrighted.
The moral of the story is don't put an iframe around someone else's content unless you ask permission. Framing content is different than linking and is considered a copyright violation.
Setting Up The Framed Page
The How And Where of Preparing iframe Content
So you know not to use someone else's content without permission because it violates copyright, there is another reason you shouldn't do it, and it is you can't control the layout of the content. This section is all about that control.
The first step in controlling how your content displays within the iframe on Squidoo is to control the layout of the content in the first place. To do this you need to host your own content on the web and follow a few simple rules in setting up the page to be displayed within the frame. I'll detail the setup next. For hosting I use Hostgator, its reliable and affordable.
One of the keys to an effective display of information within an iframe is to provide only the parts of a web page that are relevant. Mainly this means leaving off all of the extra HTML markup like body tags and head content. If you don't understand what that is it's OK, just focus on what I say next.
When creating content you need to remember the effective width of an iframe is 490px. If you go wider than this you will end up with either an ugly set of scroll bars, or hidden content.
Here is a template you can paste into a blank document and use to create the content you want to show in the iframe on Squidoo:
<style type="text/css">
<!--
#iframewrap {
width: 488px;
}
-->
</style>
<div id="iframewrap">
Content you want to put in Squidoo
</div>
If you already have a web page created you can try to format it by putting the style code and opening div just after the body tag, and the closing /div just before the closing body. It would look something like this:
<body>
<style type="text/css">
<!--
#iframewrap {
width: 488px;
}
-->
</style>
<div id="iframewrap">
all of
your current
web page content
</div>
</body>
You might encounter problems if elements like tables and other predefined CSS is set to be wider than 488px. You'll need to experiment with the different pages you want to put in the iframe on Squidoo.
The first step in controlling how your content displays within the iframe on Squidoo is to control the layout of the content in the first place. To do this you need to host your own content on the web and follow a few simple rules in setting up the page to be displayed within the frame. I'll detail the setup next. For hosting I use Hostgator, its reliable and affordable.
One of the keys to an effective display of information within an iframe is to provide only the parts of a web page that are relevant. Mainly this means leaving off all of the extra HTML markup like body tags and head content. If you don't understand what that is it's OK, just focus on what I say next.
When creating content you need to remember the effective width of an iframe is 490px. If you go wider than this you will end up with either an ugly set of scroll bars, or hidden content.
Here is a template you can paste into a blank document and use to create the content you want to show in the iframe on Squidoo:
<style type="text/css">
<!--
#iframewrap {
width: 488px;
}
-->
</style>
<div id="iframewrap">
Content you want to put in Squidoo
</div>
If you already have a web page created you can try to format it by putting the style code and opening div just after the body tag, and the closing /div just before the closing body. It would look something like this:
<body>
<style type="text/css">
<!--
#iframewrap {
width: 488px;
}
-->
</style>
<div id="iframewrap">
all of
your current
web page content
</div>
</body>
You might encounter problems if elements like tables and other predefined CSS is set to be wider than 488px. You'll need to experiment with the different pages you want to put in the iframe on Squidoo.
LInks & Forms In iframes
how to break out of the box
Terminator brought up a very good question in the comments, "if you have an optin page in an iframe, how can you make the next page load in a new window?"
Well it's not just opt-in pages, but any form or link, that you need to address when you set up your framed page.
Your first decision is, do you want a new browser window opened? or do you want the target page to replace your Squidoo lens in the browser? If it is a new window you will want to use target="_blank", for replacement target="_parent". So where does the target parameter go?
In a form, including opt-ins, you put it in the form tag, my preference is directly after the action parameter. A simple example:
<form method="post" action="page.php" target="_blank">
For a standard link anywhere in the anchor tag:
<a href="http://somesite.com/page.php" target="_blank">
If you do not include the target the content of the target page will end up in the iframe and probably look really bad.
Well it's not just opt-in pages, but any form or link, that you need to address when you set up your framed page.
Your first decision is, do you want a new browser window opened? or do you want the target page to replace your Squidoo lens in the browser? If it is a new window you will want to use target="_blank", for replacement target="_parent". So where does the target parameter go?
In a form, including opt-ins, you put it in the form tag, my preference is directly after the action parameter. A simple example:
<form method="post" action="page.php" target="_blank">
For a standard link anywhere in the anchor tag:
<a href="http://somesite.com/page.php" target="_blank">
If you do not include the target the content of the target page will end up in the iframe and probably look really bad.
An Example iframe
A Word From Our Sponsor
Below you will see an iframe, but you wouldn't know it unless I told you, or you were aware of the limitations of Squidoo formatting. Although the item contains text that you think I would want the search engines to find, I am putting it in an iframe for 3 reasons:
1. I actually don't want the text indexed for the lens because it is off topic. Search engines like pages that stay on theme. Using an iframe hides this off theme content from them.
2. I want the formatting of the text. I think it looks good and it makes it stand out from the rest of the lens.
3. There is some php code used to track how this page is requested and what links are clicked. Using an iframe is the only way to get dynamic content into Squidoo.
Here is the page I am framing. If you are interested have a peek at the source code and see how it differs from most web pages.
IFRAME BELOW:
1. I actually don't want the text indexed for the lens because it is off topic. Search engines like pages that stay on theme. Using an iframe hides this off theme content from them.
2. I want the formatting of the text. I think it looks good and it makes it stand out from the rest of the lens.
3. There is some php code used to track how this page is requested and what links are clicked. Using an iframe is the only way to get dynamic content into Squidoo.
Here is the page I am framing. If you are interested have a peek at the source code and see how it differs from most web pages.
IFRAME BELOW:
Placing The iframe
Making Sure It Looks Right
When you place an iframe you want to make sure it blends with the Squidoo lens cleanly. That means no scroll bars, no borders, proper margins and the right height. Here is the iframe code I used for the above content:
<iframe align="middle" width="490px" height="300px" frameborder="0" marginheight="0px" marginwidth="0px" scrolling="no" src="http://myspace-modifier.com/gs/usfreecontent/sahlayoutsq.php?frm=squid">
</iframe>
In case you didn't look at the source for the framed page I want to clarify I set the height of my page, the page that is being framed, to 300px using CSS. Explicitly setting the height of the framed page makes it easy to know what the height parameter (height="300px" above) should be. If you don't you will have to guess at the height, publish the lens, see if the iframe is too short or too long, go back and edit the iframe, and repeat until the you get the height right.
The width of the iframe should be 490px to fit within the Squidoo lens and not look crowded against the side content.
I prefer to set scrolling to no. If for some reason the users browser has larger fonts than normal I run the risk of some content not showing. I prefer this to scroll bars. If you would prefer scroll bars set the scrolling option to auto (scrolling="auto").
Another option would be to let the CSS on the page handle the scrolling, but that's a more advanced topic for another lens.
I recommend keeping marginheight, marginwidth, and frameborder at 0. It is best to handle these options on the page being framed.
So that's about it. Leave feedback below, and questions. I'll use it to clarify this lens.
Finaly, I am adding another example of using iframes below. You'll see 3 offers, but it is actually a page that has 15 offers and only shows 3 at random, something impossible within the standard Squidoo framework. If you visit the offer page you can see all 15 offers. I am able to have only 3 show below by adding ?oc=3 to the url in the iframe tag.
Keep your creativity open as that's the only limit.
If you are a Myspace user check out my site dedicated to customizing myspace
<iframe align="middle" width="490px" height="300px" frameborder="0" marginheight="0px" marginwidth="0px" scrolling="no" src="http://myspace-modifier.com/gs/usfreecontent/sahlayoutsq.php?frm=squid">
</iframe>
In case you didn't look at the source for the framed page I want to clarify I set the height of my page, the page that is being framed, to 300px using CSS. Explicitly setting the height of the framed page makes it easy to know what the height parameter (height="300px" above) should be. If you don't you will have to guess at the height, publish the lens, see if the iframe is too short or too long, go back and edit the iframe, and repeat until the you get the height right.
The width of the iframe should be 490px to fit within the Squidoo lens and not look crowded against the side content.
I prefer to set scrolling to no. If for some reason the users browser has larger fonts than normal I run the risk of some content not showing. I prefer this to scroll bars. If you would prefer scroll bars set the scrolling option to auto (scrolling="auto").
Another option would be to let the CSS on the page handle the scrolling, but that's a more advanced topic for another lens.
I recommend keeping marginheight, marginwidth, and frameborder at 0. It is best to handle these options on the page being framed.
So that's about it. Leave feedback below, and questions. I'll use it to clarify this lens.
Finaly, I am adding another example of using iframes below. You'll see 3 offers, but it is actually a page that has 15 offers and only shows 3 at random, something impossible within the standard Squidoo framework. If you visit the offer page you can see all 15 offers. I am able to have only 3 show below by adding ?oc=3 to the url in the iframe tag.
Keep your creativity open as that's the only limit.
If you are a Myspace user check out my site dedicated to customizing myspace
Have Something To Add? Want Clarification?
Leave a comment and help me make this lens better.
submit
-
Reply
- terallion terallion Oct 26, 2009 @ 9:39 am
- Interesting and informative lens
-
Reply
- webdude2000 webdude2000 Feb 5, 2009 @ 12:18 pm
- iframe tag is now RIP
-
Reply
- Jim10 Jim10 Nov 14, 2008 @ 3:33 pm
- I was trying to add a banner that uses iframes but couldn't seem to do it. I tried using your above code that had the iframewrap. And replaced put your content here with my banner that had the iframes but it didn't work. I'm guessing that isn't how I was supposed to do it.
-
Reply
- Aug 28, 2008 @ 12:29 am
- Hi,A really interesting and informative lens. Certainly one that can be learned from. an easy 5 stars. Many Thanks.
Feel free to check out my carpet blog
-
Reply
- Aug 25, 2008 @ 12:14 am
- Wow!Nice lens,it is very interesting as well informative.It is great to come across such lens.Thanks for sharing such info.
Check out the blog nursing home blog
-
Reply
- krisManuel krisManuel May 14, 2008 @ 10:58 pm
- Hey J, I understand the iframe more. 5-stars!
If you have time, check out my brand new lens V Powered! Thanks!
-
Reply
- CliveAnderson CliveAnderson May 13, 2008 @ 12:21 pm
- A really interesting and informative lens. Certainly one that can be learned from. an easy 5 stars. Many Thanks.
Kind Regards
Clive Anderson
-
Reply
- May 5, 2008 @ 4:36 am
- Hi,
This is very useful lens to all my squidoo friends, I have created lots of squidoo lens. But I want waiting for change my lens something different. Unexpectedly I learned some valuable information about Iframes.
If your have time to visit one of my favorite lens about bathroom remodeling
-
Reply
- lydiastath lydiastath Mar 25, 2008 @ 12:12 pm
- wow this is a great lens definately learned a lot!
http://www.basketball-layouts.com
-
Reply
- Martin_Avis Martin_Avis Jul 2, 2007 @ 3:23 am
- Thanks for this information. I've adjusted my own iframe's links and hopefully they work right now!
Martin
- Load More
Random 3 of 15
just another example
Expand Your HTML Skills
make the most of your iframe with CSS
The Zen of CSS Design: Visual Enlightenment for the Web
Amazon Price: $29.69 (as of 12/24/2009) 
HTML, XHTML, and CSS, Sixth Edition
Amazon Price: $23.09 (as of 12/24/2009)
CSS: The Definitive Guide
Amazon Price: $29.69 (as of 12/24/2009)
HTML Dog: The Best-Practice Guide to XHTML and CSS
Amazon Price: $29.69 (as of 12/24/2009)
by jandrew
Hi, my name is J Andrew Morrison. I have been an Internet marketer for over a year now and started full time March 22, 2007.
I hate scams, deception, a...
Explore related pages
Super Advanced HTML Tips and Tricks to use on Squidoo- These html tricks for Squidoo are not really that super advanced. But they are s...
Free Squidoo Banner Templates - Squidoo Graphics & HTML Codes- Ever wonder why some lenses look cooler than others? It probably has to do with...
How To Squidoo- How To Squidoo is becoming one of the hottest topics in the world of Web 2.0.&nb...
Vehicle insurance- Vehicle insurance (or auto insurance, car insurance, motor insurance) is insuran...
Pet insurance- Pet Insurance pays the veterinary costs if one's pet is ill or has an accident....
Casualty insurance- Casualty insurance policies are written to cover losses that are the direct resu...
