|
|
| |
Green Energy Gizmo Help
Adding the gizmo to your site is easy. Learn how to add it to your page or customize its appearance here.
|
|
| |
Adding it to your site
You can add the gizmo to your site by copying the HTML from one of the sample gizmo pages directly into your webpage at the spot where you would like it to appear. Here are some more detailed instructions for users of some common web editing tools.
Blogs:
Most blogs will allow you to enter HTML directly into a blog post. In some cases, you must switch from the normal graphical text editor normally used to write blog posts to a raw HTML editor.
In Wordpress, you must click the "HTML" tab at the top of the editing pane, then paste the code into your post. If you want to add the gizmo to the sidebar of your blog, then you can add it as a widget under the Appearance menu. Simply add a "Text" widget, then click the Edit button on the new Text box. Enter the gizmo code in that box, hit done, and be sure to save your changes.
If you use Google's Blogger, then you must switch from the Compose tab to HTML before entering the code. To add the gizmo to your blog's sidebar, first go to the Layout tab at the top of Blogger. From the Page Elements subtab, edit a new element on the sidebar and specify it to be an HTML/Javascript element. Then edit the new element and paste the gizmo code into the pop-up window.
Dreamweaver:
To add the code to your site, you must switch to the HTML or hybrid view. Find the spot where you would like to add the gizmo, and paste the code into the HTML window. While editing your page, the gizmo will just look like a link titled "Green Energy", but when you preview the page, you should see the gizmo correctly.
|
|
| |
Basic Customization
You can easily customize the text and background color of the gizmo to match your site.
Changing Colors:
You can change the gizmo's background and text colors by making small changes to the code provided in the examples. First, you must find the color code for the colors you would like. You can find HTML color codes here .
Each of the examples sets several Javascript variables which determine the look of the gizmo. Here is the list of variables you can change:
zF22_colorClean : The font color used for clean sources of energy. (Default: green)
zF22_colorDirty : The font color used for dirty fossil fuels. (Default: red)
zF22_textColor : The font color used for the other words. (Default: black)
zF22_bgColor : The background color for the gizmo. (Default: white)
zF22_borderColor : The color used for the border around the gizmo. (Default: black)
|
|
| |
For example, to set the clean energy color to yellow (#FEFF8F), the dirty color to orange (#FFB917), the foreground text to white (#FFFFFF), the background color to brown (#463F32), and the border to black (#000000), you would use this code:
|
|
http://zfacts.com/p/1107.html | 01/18/12 07:17 GMT
Modified: Wed, 28 Jan 2009 19:00:43 GMT
|
|
