What is a "webgarden"?
A webgarden is a little preview someone made for their website! they are designed to be displayed with other peoples webgardens, akin to site buttons, but more dynamic.
A greenhouse is a page that displays multiple peoples webgardens!
a webgarden is displayed on a greenhouse (page) in an
iframe that is 250px by 250px. Because it is an iframe rather than an image, any changes the creator makes are shown in real time on any greenhouse page that displays it.
The following code displays a webgarden: it is put into the body of the html document (the greenhouse).
<iframe src="link" height="250px" width="250px" scrolling="no"></iframe>
Where a webgarden url is put in place of 'link' (keep quotations).
Webgardens were started by Miss Moss!
How to make your own webgarden!
Making your own webgarden for others to display in their greenhouses is as simple as making an html page, you just have to keep in mind the 250px by 250px iframe it will be displayed in.
Miss Moss recommends that you name your file "webgarden.html" so it can be found by her webgarden search, but it can be named anything.
I personally styled the body element so that it was 250px wide and tall, as well as setting the margin outside of the body to 0. if you give the body a border, you will want to set box-sizing to border-box, or put the border around an element inside the body.
It may be helpful to create a test html document on your computer (you can use a simple text editor like notepad) with an iframe that has your webgarden url in it, so that you can see how your webgarden would look in a greenhouse page.
In your webgarden you will want to put a link to your websites main page, so if a viewer is interested, they can easily get to your full site. Feel free to style the rest as you like!
Thats the most simple form of webgardens, but you can also make mini versons of your webpages to be displayed in the iframe. As long as it fits the 250px dimensions and your webgarden homepage links to it, go wild!