10 Tips for the Aspiring Gadget Author

Blogger Gadgets are a great way to build customization into a website while extending the functionality provided by Blogger. Developing your own gadgets is a challenging task. Here are a few tips to help you get started.

1. Google Gadget Editor - Blogger gadgets are the same thing as Google gadgets and Google has made available an online editor with file hosting and publishing capabilities. Get it Here, then work on them from your iGoogle page.

2. Use a Test Blog - This is probably obvious for most, but you've got to setup a test blog to work on new Blogger gadgets. You do not want your site visitors dealing with bugs and errors while you work out the kinks. Even better, do most of your testing on iGoogle.

3. My Gadgets on iGoogle - Get it and use it to add gadgets to your iGoogle page and disable caching while testing. This is a great way to test out your gadgets without hitting your test blog repeatedly.

4. Gadget Checker - This gadget checks the code of your gadget for errors. Load it into your iGoogle page and check for errors as needed.

5. Disable Caching  - Cached gadgets make testing a real pain, include these two scripts to disable it anywhere the gadget is used. This disables caching for every gadget on the page though, so you Must remember to remove them before publishing a gadget.

<script src='http://www.google.com/friendconnect/script/friendconnect.js' type='text/javascript'></script>
<script type="text/javascript">google.friendconnect.container.setNoCache(1);</script>

6. Gadget Styles - Gadgets run in an iFrame which means all the styles on the running blog are inaccessible. Blogger does provide some style info to your gadgets which allow you to blend common elements. If you're getting more advanced you'll need to provide users styling options through User Preferences.

7. User Preference Validation - Validate any String user preferences you provide. You can't be sure people will type a number in when you ask for it or a correct string. I recommend when possible to use Enum and Bool preference types instead.

8. Dynamic Height - To make your Gadget size to the content you're providing add the Dynamic Height feature and use javscript command after everything loads. Otherwise, you'll get scroll bars you may not want.

In ModulePrefs: <Require feature="dynamic-height"/>
Javascript to make it happen: gadgets.window.adjustHeight();

9. Common Features - Many gadgets find a few common features very useful. You shouldn't include them unless they're needed, but these are a good starting point to add in ModulePrefs. Figure out which you need, then remove the ones you don't:

<Require feature="opensocial-0.8"/>
<Require feature="google.blog"/>
<Require feature="skins"/>
<Require feature="views"/>

10. Read the Developer's Guides - The Gadget Developer's Guide and Blogger Gadget Guide have a lot of useful examples and further information in them. There is a lot to read and digest, but several of the tips here come out of those guides. There's a lot to learn, dig in.

Support JSBlogStop:

Donate with Dwolla