Menaruh Barisan Social Bookmark Seperti Technocrati, StumbleUpon, Digg Ditiap Posting Blogger

Kali ini tutorial mengenai cara menaruh deretan social bookmark yang terdiri dari Digg, StumbelUpon, Technocrati, Del.icio.us, Yahoo, Simply, Furl, Spurl, Blinklist dan Reddit. Semuanya dalam satu deret dibawah setiap posting blog anda, untuk memudahkan pengunjung/pembaca blog untuk melakukan bookmarking dari posting anda dan men-sharingnya kepada dunia, beserta image dari masing-masing servis social bookmark, contohnya bisa dilihat dibawah posting ini. Caranya:

1. Login ke blogger.com.
2. Layout.
3. Edit HTML.
4. Klick “Expand Widget Template”.

Ini adalah kodenya:

<br/>
<a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Digg' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/digg.gif'/></a>
<a expr:href='"http://technorati.com/faves?add=" + data:post.url' target='_blank'><img alt='Technorati' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/technorati.gif'/></a>
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='del.icio.us' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/delicious.gif'/></a>
<a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Stumbleupon' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/stumbleupon.gif'/></a>
<a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Reddit' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/reddit.gif'/></a>
<a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;Url=" + data:post.url + "&amp;Title=" + data:post.title' target='_blank'><img alt='Blinklist' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/blink.gif'/></a>
<a expr:href='"http://www.furl.net/storeIt.jsp?t=" + data:post.title + "&amp;u=" + data:post.url' target='_blank'><img alt='Furl' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/furl.gif'/></a>
<a expr:href='"http://www.spurl.net/spurl.php?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Spurl' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/spurl.gif'/></a>
<a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?t=" + data:post.title + "&amp;u=" + data:post.url' target='_blank'><img alt='Yahoo' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/yahoo.gif'/></a>
<a expr:href='"http://www.simpy.com/simpy/LinkAdd.do?href=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Simpy' src='http://i191.photobucket.com/albums/z76/tipsfornewbloggers/simpy.gif'/></a>

Pilihan Penempatan:

Jika anda ingin menaruhnya tepat dibawah posting, maka ini contohnya:

<div class='post-body'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!– clear for photos floats –>
</div>
Taruh Kodenya Disini
<div class='post-footer'>
<p class='post-footer-line post-footer-line-1'>

Jika ingin menaruh kode social bookmark di atas label, maka ini contohnya:

Taruh Kodenya Disini
<p class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
<b:if cond='data:post.labels'>

Dan jika ingin meletakan dibawa label, ini contohnya:

<p class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'>
<data:label.name/>
</a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>
</p>
Taruh Kodenya Disini

Sehingga setiap kali pengunjung anda ingin membookmark posting dari artikel yang mereka baca, mereka tinggal klik saja. Dan sebagai uji coba, silahkan anda men-stumble, dan mendigg artikel ini…:)

Sekian dan semoga bermanfaat! & Sampai jumpa di posting berikutnya.

Wassallam.