Displaying Your Flickr Photos

(Click to view full size image)

Flickr is the best online photo management to share your family photos with friends and relatives. As for the amateur photographers, they can show off their work in gaining recognition for their photos.Written word will continue to be the basis of telling a story, but pictures will enhance that story. Some people have had quoted this as a Chinese Proverb - "One picture is worth ten thousand words" but we do know that the phrase is American in origin - "A picture is worth a thousand words". Anyhow, both have the same meaning.

This tutorial will guide you through the steps. Login to your Dashboard> Layout> Edit Html. Copy here and paste these lines into your CSS section. The preferred place to add CSS code is right in front of the closing b:skin tag

Save the template. Next, click a button below to easily add the script into your page element.

<div class="flickrbadge"><p><a href="http://www.flickr.com/photos/11414938%40N00">MY flickr</a></p></div><script src='http://onlinebiztutorials.googlepages.com/flickrbadgeloader.js' type='text/javascript'/>

You click the link and view the code details. Change the flickr id to yours as shown below:-

After you make such an amendment, just click the "Add widget" button to complete the entry. Then, click and drag to rearrange the said page element on your blog. The suitable place is above your blog post unless your sidebar's width is more than 410px in order to accomodate all your five thumbnails in a row.

To find your flickr id, simply click the RSS feed at the bottom of your stream as shown below:-

Script courtesy of Christian Heilmann

He is the author of Beginning JavaScript with DOM Scripting and Ajax, and he contributed a chapter on accessible JavaScript to Web Accessibility—Web Standards and Regulatory Compliance. He is a lead developer at Yahoo! in England.