My first attempt at a web site / WordPress widget is the Cute Kitten of the Day widget. You can see it in action on my right sidebar. The kitten picture changes each day automatically. All you have to do is add the widget to your web site. It’s easy!
There are two methods to adding the widget:
- Manually (works for most web sites and blog software), or
- Automatically in your WordPress blog.
1. Add the widget manually
The code below works on multiple blogging platforms, including WordPress and Blogger (click here to see it on our Blogger test blog).
It’s easy to add the widget manually, just copy and paste the HTML code below into your web site’s layout or sidebar. Hover your mouse over the code below to bring up the menu in the upper right corner of the box. Choose either “view plain” or “copy to clipboard” to copy the code for the widget, then paste it into your blog’s sidebar or other code. That’s all there is to it!
<div style="border-radius:5px;width:175px;border:1px solid black;background-color:#FFFFFF;padding:0px;margin-left:auto;margin-right:auto;margin-top:10px;margin-bottom:20px;"> <div style="font-weight:bold;border-radius:0px;width:175px;text-align:center;background-color:#000000;color:#FFFFFF;text-decoration:none;text-transform:uppercase;font-family:verdana,helvetica,arial,sans-serif;font-size:15px;padding:0px;line-height:19px;">CUTE KITTEN OF THE DAY!</div> <div style="border-radius:0px;width:173px;padding:3px 0px 0px 0px;text-align:center;margin-left:auto;margin-right:auto;margin-bottom:auto;display:absolute;position:static;"><img style="border-radius:5px; border:1px solid black;float:center;padding:0px;margin:0px;display:inherit;position:static;margin-left:auto;margin-right:auto;" width="165" src="http://kittens.dailywidget.com/kitten.jpg" /></div> <div style="width:170px;text-align:right;padding:4px 5px 5px 0px;margin:0px;border:0px;"><a href="http://dailywidget.com/cute-kitten-of-the-day-widget/" style="font-weight:normal;text-decoration:none;color:#FF0000;font-family:verdana,helvetica,arial,sans-serif;font-size:8px;padding:0px;margin:0px;line-height:8px;display:inherit;position:static;">(get widget)</a></div></div>
2. Add the widget automatically in WordPress
The Cute Kitten of the Day widget has been approved by WordPress, so you can now install it from here: Kitten of the day widget!.
