Sabtu, 09 Januari 2010

menaruh social bookmarking di 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…:)



.How To Make "Breadcrumb-Navigation" In Blogger

Pada percobaan pertama ini saya mencoba membuat sebuah navigasi seperti layaknya "browse"di windows explorer.saya dapat kode ini dari salah satu teman sesama blogger.tetapi tutorial ini dalam bahasa Inggris.tidak perlu khawatir karena tutorial ini  mudah di pahami.gk usah banyak basa basi langsung saja ke TKP.


1.Please log in to blogger with your ID

2.Click Layout
3.Click Edit HTML tab
4.Click Download Full Template and please back up your template first
5.Please check the small box beside Expand Widget Template
Find the code ]]>
6.Copy and paste the code below exactly above the code

]]></b:skin> .breadcrumbs{ padding:5px 5px 5px 0; margin:0;font-size:95%; line-height:1.4em; border-bottom:4px double #cadaef; }


Find the following code in your template :


<div class='post hentry uncustomized-post-template'>


Copy and paste the code below exactly below the code <div class='post hentry uncustomized-post-template'>

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'> Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; <b:if cond='data:post.labels'><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 != &quot;true&quot;'> , </b:if> </b:loop> </b:if> &#187; <data:post.title/> </div> </b:if> </b:if>


7.Click Save Template button
Wait for a while until your template saved
Open your blog, click the title of an article, see the result
Finished.

Talk to talk

Hallo ini adalah blogku yang kedua setelah http://today4forever.blogspot.com yang akan aq gunakan untuk experiment atau dalam bahasa Indonesia artinya percobaan.tapi tidak mengesampingkan blog aq satunya.trims

Jumat, 08 Januari 2010

tes

Lorem ipsum vim ut utroque mandamus intellegebat, ut eam omittam ancillae sadipscing, per et eius soluta veritus.