You can modify the way the widget appears on your site. We'll focus on the JavaScript version, since the HTML version of the widget (the simple image+link) can be changed easily with CSS styles. Note that the JavaScript version can also be styled with CSS by referencing its ID - moodSitesWidgetImg. For example:
#moodSitesWidgetImg{top:250px;}
On to the JavaScript version. Here's a sample bit of code that you will place in the <head> section of your website:
<script type="text/javascript">var mdTopPos=150;</script>
<script type="text/javascript" src="http://www.moodsites.com/mood/12345.js"></script>
<script type="text/javascript" src="http://www.moodsites.com/mood/12345.js"></script>
Notice the variable declared above the main Moodsites widget JavaScript - "mdTopPos." All special variables are declared like this, above the main script. Here are the options you have to choose from (single quotes around the default value mean it's a string, otherwise it's an integer):
| Variable name | Default value | What it does |
| mdTopPos | 60 | Controls how far from the top of your page the widget will appear. |
| mdLeftPos | -3 | Controls how far from the left of your page the widget will appear. |
| mdRightPos | No default | Controls how far from the right of your page the widget will appear. |
| mdBotPos | No default | Controls how far from the bottom of your page the widget will appear. |
| mdBgCol | '#FFFFFF' | Color of the widget's overlay color. Should be a hexadecimal color preceded by a pound/hash mark. |
| mdAnimate | 1 | Set to 0 (zero) to turn off mouse hover animation. |
| mdWidgImg | Depends on mood and mood level | Widget image. The default pulls images from our server. Replace with an absolute or relative path to your image, e.g. '/mysite-images/happy.jpg'. |
