Display a badge from Flickr. Tips and tricks for webmasters
Running ...


A Flash badge


  • Flickr give us a code, which can be summaries like this :

<!-- Start of Flickr Badge -->

<style type="text/css">

... some style sentences ...

</style>

<script type="text/javascript">

... javascript sentences ...

</script>

... html sentences ...

</div>
</div>

<!-- End of Flickr Badge -->


  • Copy the green part, where the badge must appear.
  • Create a file (with notepad) which contain the css (the blue part). Name this css file style_flickr.css
  • Insert a <link> tag to load the StyleSheet : 

<link rel="stylesheet" type="text/css"
href="http://YOURSITE/style_flickr.css">


  • The result :


www.flickr.com
This is a Flickr badge showing public photos from prac53. Make your own badge here.




Using a Google Gadget


flickr-badge.xml


  • Parameters of the Gadget


UID : The Flickr User Id. Use IdGettr to find your Flickr user Id
SET : Number of the Set to display

TIT : Title to display
TEX : Text to display (footer)
LNK : Link on the text (footer)

BCOL : #rrggbb Border color
BKCOL : #rrggbb Background color
LKCOL : #rrggbb Link color
CCOL : #rrggbb Color of container





An HTML badge


  • Flickr give us a code, which can be summaries like this :

<!-- Start of Flickr Badge -->

<style type="text/css">

... some style sentences ...

</style>

<table ...

... some html ...

</td></tr></table>

<!-- End of Flickr Badge -->




  • Copy the green part, where the badge must appear.
  • Create a file (with notepad) which contain the css (the blue part). Name this css file style_flickr.css
  • Insert a <link> tag to load the StyleSheet : 

<link rel="stylesheet" type="text/css" href="http://YOURSITE/style_flickr.css">


  • The result :


www.flickr.com



More Informations



One Day - One Label - One Wine




facebook - Philippe Chappuis