.. flickr badge
   flickr_badge.rst
   Created: Sun Mar 21  2010  21:21 uur
   Last modified: Fri Jun 25, 2010  11:45 uur 

============
Flickr badge
============

Sphinx lets you use html code. Start an indented html block with ``.. raw:: html html``. So it is very easy to embed all kinds of widgets.

Use this code::

        .. raw:: html

                <!-- Start of Flickr Badge --> <style type="text/css">
                #flickr_badge_source_txt {padding:0; font: 11px Arial,
                Helvetica, Sans serif; color:#666666;} #flickr_badge_icon
                {display:block !important; margin:0 !important; border: 1px
                solid rgb(0, 0, 0) !important;} #flickr_icon_td {padding:0 5px
                0 0 !important;} .flickr_badge_image {text-align:center
                !important;} .flickr_badge_image img {border: 1px solid black
                !important;} #flickr_badge_uber_wrapper {width:150px;}
                #flickr_www {display:block; text-align:center; padding:0 10px 0
                10px !important; font: 11px Arial, Helvetica, Sans serif
                !important; color:#3993ff !important;}
                #flickr_badge_uber_wrapper a:hover, #flickr_badge_uber_wrapper
                a:link, #flickr_badge_uber_wrapper a:active,
                #flickr_badge_uber_wrapper a:visited {text-decoration:none
                !important; background:inherit !important;color:#3993ff;}
                #flickr_badge_wrapper {background-color:#ffffff;}
                #flickr_badge_source {padding:0 !important; font: 11px Arial,
                Helvetica, Sans serif !important; color:#666666 !important;}
                </style> <table id="flickr_badge_uber_wrapper" cellpadding="0"
                cellspacing="10" border="0"><tr><td><a
                href="http://www.flickr.com" id="flickr_www">www.<strong
                style="color:#3993ff">flick<span
                style="color:#ff1c92">r</span></strong>.com</a><table
                cellpadding="0" cellspacing="10" border="0"
                id="flickr_badge_wrapper"> <script type="text/javascript"
                src="http://www.flickr.com/badge_code_v2.gne?show_name=1&count=5&display=random&size=t&layout=v&source=user_set&user=39936333%40N00&set=72157603893716778&context=in%2Fset-72157603893716778%2F"></script>
                <tr> <td id="flickr_badge_source" valign="center"
                align="center"> <table cellpadding="0" cellspacing="0"
                border="0"><tr> <td width="10" id="flickr_icon_td"><a
                href="http://www.flickr.com/photos/jeroenleijen/sets/72157603893716778/"><img
                id="flickr_badge_icon" alt="jeroenleijen's P o r t f o l i o
                photoset"
                src="http://farm1.static.flickr.com/96/buddyicons/39936333@N00.jpg?1160343731#39936333@N00"
                align="left" width="48" height="48"></a></td> <td
                id="flickr_badge_source_txt">jeroenleijen's <a
                href="http://www.flickr.com/photos/jeroenleijen/sets/72157603893716778/">P
                o r t f o l i o</a> photoset</td> </tr></table> </td> </tr>
                </table> </td></tr></table> <!-- End of Flickr Badge -->

to get this (a badge for my Flickr page):

.. raw:: html

        <!-- Start of Flickr Badge -->
        <style type="text/css">
        #flickr_badge_source_txt {padding:0; font: 11px Arial, Helvetica, Sans serif; color:#666666;}
        #flickr_badge_icon {display:block !important; margin:0 !important; border: 1px solid rgb(0, 0, 0) !important;}
        #flickr_icon_td {padding:0 5px 0 0 !important;}
        .flickr_badge_image {text-align:center !important;}
        .flickr_badge_image img {border: 1px solid black !important;}
        #flickr_badge_uber_wrapper {width:150px;}
        #flickr_www {display:block; text-align:center; padding:0 10px 0 10px !important; font: 11px Arial, Helvetica, Sans serif !important; color:#3993ff !important;}
        #flickr_badge_uber_wrapper a:hover,
        #flickr_badge_uber_wrapper a:link,
        #flickr_badge_uber_wrapper a:active,
        #flickr_badge_uber_wrapper a:visited {text-decoration:none !important; background:inherit !important;color:#3993ff;}
        #flickr_badge_wrapper {background-color:#ffffff;}
        #flickr_badge_source {padding:0 !important; font: 11px Arial, Helvetica, Sans serif !important; color:#666666 !important;}
        </style>
        <table id="flickr_badge_uber_wrapper" cellpadding="0" cellspacing="10" border="0"><tr><td><a href="http://www.flickr.com" id="flickr_www">www.<strong style="color:#3993ff">flick<span style="color:#ff1c92">r</span></strong>.com</a><table cellpadding="0" cellspacing="10" border="0" id="flickr_badge_wrapper">
        <script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?show_name=1&count=5&display=random&size=t&layout=v&source=user_set&user=39936333%40N00&set=72157603893716778&context=in%2Fset-72157603893716778%2F"></script>
        <tr>
        <td id="flickr_badge_source" valign="center" align="center">
        <table cellpadding="0" cellspacing="0" border="0"><tr>
        <td width="10" id="flickr_icon_td"><a href="http://www.flickr.com/photos/jeroenleijen/sets/72157603893716778/"><img id="flickr_badge_icon" alt="jeroenleijen's P o r t f o l i o photoset" src="http://farm1.static.flickr.com/96/buddyicons/39936333@N00.jpg?1160343731#39936333@N00" align="left" width="48" height="48"></a></td>
        <td id="flickr_badge_source_txt">jeroenleijen's <a href="http://www.flickr.com/photos/jeroenleijen/sets/72157603893716778/">P o r t f o l i o</a> photoset</td>
        </tr></table>
        </td>
        </tr>
        </table>
        </td></tr></table>
        <!-- End of Flickr Badge -->


-----

.. cssclass:: pubdate

        :Published: Fri Jun 25 2010