Wednesday, July 22, 2009

How To: List on blog sidebar

Amber asked about the list in the sidebar. Here's how you can have one too:

List Prep:
1) Make a Google Docs spreadsheet. Pick one column to display on your blog. Stick your list in that column
2) Publish your spreadsheet as a web page (in the share menu)
3) Choose to share a certain cell range, which should be the column you're using. Eg. I'm using Column B cells 2 to 750. (Google will only show the cells that you have created in the spreadsheet, not all 750).
4) Copy the URL that it displays to you.

Blog Setup:
1) Add an HTML gadget.
2) Paste the following code in your gadget, but replace the blue link with the Google Docs spreadsheet link you copied above.
3) Save the changes and you're done!

<iframe style="width:210px;height:500px;overflow-x:hidden;" src="http://spreadsheets.google.com/pub?key=raMJUjiwqW0xc0C0ubNyjgw&single=true&gid=0&range=B2%3AB750&output=html"></iframe>


More fun:
If you want to change the height or width, just change the number of pixels in the HTML code. To add a horizontal scroll bar, remove the overflow-x:hidden; The scroll bar will then appear automatically if the content is wider than the pixel width.

1 comment:

ThePalmers said...

Thanks for the how-to!