Adding Another Line of Photos Using Flickr Widget

I talked about the Ben’s Flickr Widget in Widget Quickies, last week. While completely redoing my wife and my personal website, I needed to use the Flickr Widget. The problem I came across was I wanted two lines of pics. The widget allows for you to have one line of pics either vertical or horizontal but allows you to choose the amount of photos used.

To make the layout 2 lines, in the options of the widget make sure to choose vertical. Then edit the Flickr Badge Widget code

Look for this in the plugin code:

<table id="flickr_badge_uber_wrapper" cellpadding="0" cellspacing="5" border="0"><tr><td>
		<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=<?=$count?>&display=<?=$display?>
&size=<?=$size?>&layout=<?=$layout?>&source=<?=$source?>&user=<?=$flickrid?>
&tag=<?=$tag?>&group=<?=$flickrid?>"></script>
		</td></tr></table>

We are going to add a table so there are 2 tables side by side. There may be a better way to do this but this works great.

Change the above code to:

<table><tr><td><table id="flickr_badge_uber_wrapper" cellpadding="0" cellspacing="5" border="0"><tr><td>
		<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=<?=$count?>&display=<?=$display?>
&size=<?=$size?>&layout=<?=$layout?>&source=<?=$source?>&user=<?=$flickrid?>
&tag=<?=$tag?>&group=<?=$flickrid?>"></script>
		</td></tr></table></td>
<td><table id="flickr_badge_uber_wrapper" cellpadding="0" cellspacing="5" border="0"><tr><td>
		<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=<?=$count?>&display=<?=$display?>
&size=<?=$size?>&layout=<?=$layout?>&source=<?=$source?>&user=<?=$flickrid?>
&tag=<?=$tag?>&group=<?=$flickrid?>" target="_blank"></script>
		</td></tr></table></td></tr></table>

Now by choosing 2 photos in the options, you will have 2 lines of 2, you can see it in action at RichandStephanie.com

Note: To fit on the page I added breaks on the src= line, it should be one long line, pull each of the &’s back up a line

Technorati Tags:

     

Leave a Reply