Amateur webmaster tip. This is yet another easy tip to include a widget with your (or someone else’s) Flickr pictures on your website.

This one comes courtesy of Widgetbox. Here is a step-by-step procedure:

1. Go to widgetbox

2. Click on “Make a widget”

3. Click on “Blog/Feed”

4. Go to Flickr

5. Choose a photo set and click on “feed” on the lower left corner of the page

6. Copy the feed url that appears in your web address bar, or control click the feed button and copy the link

7. Go back to the widgetbox page, paste the address and click on “continue”

8. Paste the address again in the lower box and click on “OK”

9. Adjust the appearance settings of your widget, and click on “publish blidget”

10. Grab the code (you will need to register first on widgetbox). Once you click on “Get widget”, you will be presented with a few ready-made options. If you use Rapidweaver or your own Wordpress blog, click on “get code”. You will then need to paste the code where it fits best on your website.

For Rapidweaver, you can paste the code in any styled page or in your sidebar. On Wordpress, you can either edit sidebar.php (for your sidebar) or another file such as header.php (for your header), or create a Wordpress widget and paste the code there.

I have pasted the code in my Wordpress post. Here is the result:

With the advent of tens of popular social websites, there is an increasing urge to integrate your site with your social virtual network. Let’s see how to do it on sites designed with RapidWeaver and Wordpress. For a change we will try to show how to achieve this with pictures and only a few words.

First, create your Flickr badge

Starting point: Flickr tools.

Insert your badge on RapidWeaver

The most obvious place to insert your badge is in the sidebar, but you can put it anywhere using different pages styles. It works in html, styled text and any other pages compatible with styled text, such as RapidFlickr or Carousel.

Insert your badge on your Wordpress site

The easy way to insert a badge on your sidebar is to use the Flickr badge widget. However, if you do not use widgets or prefer to put your badge in a post or in a page, simply paste the code you got from the Flickr website in your post or page.

That’s it!

If you are interested in more Flickr tricks and tips, you may want to check out Integrating Flickr pictures on your Wordpress or RapidWeaver site and Integrating a Flickr photo map on your website.

In my previous Flickr images post I focused on the built-in Flickr functions of RapidWeaver and the various Flickr image integration plugins available for both Wordpress and RapidWeaver. But there are literally hundreds of tools and webapps available to integrate Flickr images on your website which have not been specifically designed with RapidWeaver or Wordpress in mind. Fear not, you do not need to be a big web wizard to unleash the power of Flickr and put great photo effects on your website.

Today I will be looking at the various options available to allow picture browsing on a map.

Prerequisite: you need to tell Flickr where pictures have been shot

Unless you have a very sophisticated camera with GPS integration, Flickr cannot guess where pictures have been shot. You must first put your pictures on a map, in a process known as “geotagging”. There are various ways to do so:

• The über geek way: synchronize gps data with your camera. This is reserved to the professionals or the very advanced photography amateurs, and requires that you have specific gear or software that allows you to match the time stamp of a gps coordinate on your handheld gps with the time stamp of the photos taken with your digital camera. There is one free photo software called Jet Photo Studio that allows you to match digital photos with time synchronized GPS track logs. The popular Apple iPhoto software also does it, but you need to unlock the feature.
• Geotagging photos on your computer. The same Jet Photo Studio also allows for relatively easy placement of your photos on a map in conjunction with Google Earth.
• Geotagging on Flickr. The most straightforward way to geotag your pictures is by using Flickr itself. Once you have uploaded your photos, click on the >”Organize” tab in Flickr, select the photos you want to put on a map, and Flickr lets you search locations on a Yahoo map on which you can drag your pictures. This process is shown in the image below

• Geotagging on steroids. If you are serious about geotagging, or if you are planning on using the Travelr map described below, you will want to use the localize it bookmarklet. This powerful webapp lets you place any of your Flickr images on a map from within Flickr in a much easier and more elegant way than Flickr itself. The elegance of this solution is shown below. We will also see that Travelr does not require the geotagging of all your photos, which is a big time saver.

Once you have geotagged the pictures which shall be shown on your map, the fun can begin.

Your Flickr photo map using Trippermap

Trippermap is a beautiful free webapp that lets you create a world map showing where your geotagged pictures were taken, zoom on any of them, view them as a slideshow and much more. The service requires that you sign up, and it takes a few minutes before your geotagged photos appear on the map. Below is Countries in Colors’ very own Flickr photo map using Trippermap.

Once your map is ready, Trippermap generates a short code which you simply copy and paste into your Wordpress or RapidWeaver post or page. The service works with all standard html pages, so you can also use it if you are using other publishing platforms. A premium version of Trippermap is also available and lets you add more photos, show your travel paths and use other maps (including Google, Yahoo and MSN satellite images) against a small annual fee.

Your Flickr photo map using Travelr

A slightly less powerful option is Travelr. It is also a little more cumbersome to install, as it requires you to download files which you must customize to fit your needs before posting them to your website. Integration is therefore less easy than with Trippermap, but Travelr has two advantages. First, it takes the hassle out of supplying geographic coordinates for each photo by only requiring them once for each location – not for each photo. This brings significant time saving if you want to publish lots of pictures. Second, you are hosting the map on your own server, which means you get more control and you are not dependent on a third party to host your map. You can see it in action on our Blue Site: Blue Brussels, Blue Bulgaria and Blue Hong Kong. The interface is also slicker than Trippermap’s, as shown below.

Travelr does not allow for many pictures to be posted, has a less powerful zoom, and may be tricky to integrate – I had to use an iframe above :( This being said I like its interface better.

I hope you will find this useful. If you like browsing pictures using maps, I’d suggest you check out the great Localize.us website: amazing! Enjoy Flickr!