Including HTML Pages

Overview

Use community forums, forms, polls, scripted applications, and other webpage gizmos (widgets) in your wetpaint wiki. This is accomplished by using the HTML, <IFRAME> code along with a widget to insert an exterior webpage directly into your wiki. It offers what you might think of as a picture-in-picture type affect on your wiki page.
To set this up in your wiki you will need some knowledge of HTML coding basics, and understanding of the IFRAME attributes. If you are unfamiliar with those you can get additional information from such as the WDG information page about IFRAME or by running a search for "HTML codes", or "IFRAME attributes" from any popular search engine site.

This should look like: <iframe Your HTML Code></iframe>

Example

Here Is an Iframe Template You can use instantly. Just substitute the URL of the page you want to use and you're done:

<iframe name="I1" src="http://www.yourwebsitehere.com" width="889" height="359" scrolling="yes">

Tips

Like most HTML codes, the IFRAME has a few quirks that you'll need to keep in mind when using it:

The IFRAME code isn't recognized by all browsers. It is important to include alternative content for those that don't read it.
Links found on a page inside an IFRAME, will continue to open inside the IFRAME, unless the coding in the exterior page is set to target a new window.
IFRAMES are not scalable. So be sure to set the width and height attributes.

Steps to take to include an exterior web page in your wiki:

1. Open the Easy Edit window for the wiki page where you wish to include the exterior page.
2. Click on the Widget option.
3. Choose the "Other Widget" app from the list.
4. Type your IFRAME code with the appropriate attributes in the code window.
5. Save your widget and the page changes to see the IFRAME in action.

Three examples:

Insert a Forum:
http://artshares.wetpaint.com/page/CHW+Monthly+ATC+Swap
(The CHW community forum is shown in this iframe. The forums platform renders at a larger screen size than my IFRAME, so scrolling will be required to see entire pages in the IFRAME.
Insert Scripted graphics or widgets:
http://artshares.wetpaint.com/page/.+PaintChip
(on the bottom of the page, the flickr badge and links to the right are in an iframe. This IFRAME disguised because I used the same background color as the wiki page and no scroll bars.)

I hope these examples will show you how the IFRAME code has many useful purposes as well as the importance of understanding the quirkiness of this code.

Attributes for the IFRAME code tag:

SRC: URL of the document to go in the frame

HEIGHT: height of the inline frame

WIDTH: width of the inline frame

NAME: name of this inline frame

LONGDESC: URL of a long description of the contents of the frame

FRAMEBORDER: if the frame should have a border around it

MARGINWIDTH: internal left/right margin for the frame

MARGINHEIGHT: internal top/bottom margin for the frame

SCROLLING: if the frame should have scroll bars

ALIGN: alignment of the frame object to text around it

VSPACE: space above and below the frame

HSPACE: space to the left and right of the frame

Example IFRAME embed

Code used

<iframe frameborder="0" height="335" src="http://show.zoho.com/embed?USER=sharonbetts&DOC=NECC.odp" width="450"></iframe>

Threads for this page

Anonymous

ok so this is wierd...

Jul 21 2010, 6:40 PM EDT by naruto87

Thread started: Jul 21 2010, 5:00 PM EDT Watch

I was going to added a animated picture to my site. In the past I have no trouble. I clicked on the 'other' option under widgets and it worked fine. Today I went to my profile to add another picture, but under widgets the option 'other' is no longer there. Is this just my acount or is there some problem with the site?

1 out of 1 found this valuable. Do you?

Keyword tags: (edit keyword tags)

Post reply

Show Last Reply

alirazachang

problem !!!

Mar 8 2010, 1:26 PM EST by CryingDove

Thread started: Mar 8 2010, 4:01 AM EST Watch

hey guys i even added iframe but it's not showing my amazon product ?? do you know why
<iframe src="http://rcm.amazon.com/e/cm?t=bestsalesandb-20&o=1&p=8&l=as1&asins=B001SEQQBE&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=0000FF&bc1=000000&bg1=FFFFFF&f=ifr" style="width:120px;height:240px;" scrolling="no" marginwidth="0" marginheight="0" frameborder="0"></iframe>

here's the code

Do you find this valuable?

Keyword tags: (edit keyword tags)

Post reply

Show Last Reply

ForestForTreesTMS

Thanks!

Aug 29 2009, 11:02 PM EDT by ForestForTreesTMS

Thread started: Aug 29 2009, 11:02 PM EDT Watch

Thanks to everyone who worked on this page. I feel like I can pretty much embed anything using it. Further, it seems like perfectly satisfactory workaround for one of the very few disappointing features of Wetpaint: their completely static templates. Using the IFrames, it looks like I can embed arbitrary html, and have, for example, some text that I can embed on every page of my wiki (we have 250). Further, if I want to update the text, I will only have to change it once.

A great feature, completely underutilized.

	Subject:
	Message:
	Quote:
	Tags:
	Category:	General Discussion

Step 5	Browser Support	Please help?
Help?	Ask & Answer	Reiki applicable to serious cancer patient?
Help	Profile help	Text
What's happened to wetpaint ads?	Change of Domain Name & Url Forward Address help	Account Banned - Why?