Rasanya sudah kehabisan ide untuk post blog saya yang satu ini. Tutorial blog sudah habis diborong para blogger lain membuat saya harus putar otak cari tutorial yang unik dan membuat blogger tertarik untuk menerapkan diblognya. Pasang Social Bookmark dan Related Post di blog kayaknya ide bagus nie. Sebelumnya dulu udah ada yang menanyakan tentang tutorial ini. Tapi saking sibuknya optimasi seo kontes Hidup Untuk Berbagi, saya urungkan untuk mengepostnya. Nah, baru sekarang kepikiran karena sudah hampir seminggu lebih blog ini tidak terjamah postingan baru. Seperti yang anda lihat bila kursor anda arahkan pas dibawah postingan blog ini akan muncul widget social bookmark dan related post. Nah pengen tahu caranya?
- Login ke blogger degan ID anda.
- Klik Tata Letak.
- Kemudian klik tab Edit HTML
- Click Download Full Template and please back up your template first. Untuk menghindari bila sewaktu-waktu ada kesalahan.
- Beri tanda centang pada kotak kecil di samping tulisan Expand Template Widget.
- Cari kode ]]></b:skin>
- Copy lalu paste kode di bawah ini persis di atas kode ]]></b:skin>
- #socials {
}
#socials h3 {
border-bottom:1px solid #c2c2c2;
color:#414141;
margin-top:10px;
margin-bottom:10px;
padding-bottom:3px;
letter-spacing:-0.006em;
text-align:left;
}
#subscribe-line {
}
#subscribe-line img {
margin-bottom:-5px;
}
#bookmarks-footer {
padding: 0px 10px 0px 0px;
text-align: center;
overflow: hidden;
}
#bookmarks-footer a {
text-decoration:underline;
font-size:80%;
}
#bookmarks-footer a:hover {
text-decoration:none;
}
#bookmarks-footer span {
font-size: 27px;
line-height: 48px;
font-weight: bold;
padding-right: 5px;
}
.float-wrap {
overflow: hidden;
}
.float-wrap div {
width: 298px;
float: left;
margin-top:10px;
}
#bookmarks-footer .stumble { background: url(http://bsaves.com/files/bloggertemplates/images/icons/social_bookmarking/very_squarepack/sumbleupon_48.png) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .digg{ background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij_10gCdavND0Xvd1sJV6mZzAqWpkfgxxpUNNBc8AzmPcHqk1fFA98Y52s0lgp2saeWBdHyudeIJ7PGDiIFGXuYyIolpWMOy3JN49UAbJc3Ivrs2lPG5ZRVmMrHNl_tB2aLXgBYPxq_Csy/) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .tweet { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDU4WcJ_ysQkLd-Y3svS-QlhCd24_rOtHjYKQxvmMIeRHVzoYuLHHdVSb54QxU_WGHh-o9u05OLrogjxL5sZKc7AyMfG8n3JshoflXWpXmKrUCCyPoZLKFcda4Vs5ucvDFy1S1RKMdD5Cw/) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .save { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhB_CBNJMcnFOZ5uEOFXW6QKA9BFO-MjAz2b33yBbkzPyS1rls3EmxCsanMIK7osrk838z4eCzPtfi9IBsoYVyeGN2WJfXmQoq5nLzHN7Ha9PI0lZ1HnCjOvbKPhecubm4GjOURwfLEDNUy/) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .reddit { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4pPazUsN7yylq-uVedHr3rEoSH_z5wlaVZSYqzf9NRWx4okxqperx5RKnmcpCZdHDxTEDK2rfoE362mxmfoOj6SgUzF1ONZN8BdnV8yZ5La7h9mSaLgK8kr4DQ5i0aW8DWzq16tiYDR-9/) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .more { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioimxHzXmBF1TpXGAQF6_-OMZRltkfkJUfOOm3zflJkEvWQvrPQQETQ9v2yEeK0Cn5A3eYO8vkhPaibmIWoA5VxW7WbI4i2bIlUH5cdyRma_qDC9H3abTOKvHZwst1z5dsjM-l92_R2s6D/) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left; } - Pasang script <script src='http://torrentmoon.com/javascripts/mv_Related_posts_hack.js' type='text/javascript'/> dibawah kode ]]></b:skin>
- Anda ubah ukuran width: 298px; sesuaikan dengan ukuran post blog anda.
- Pasang kode dibawah ini persis diatas kode <data:post.body/>
- <b:if cond='data:blog.pageType == "item"'>
<div id='socials'>
<div class='float-wrap'>
<div>
<div id='bookmarks-footer'>
<h3>Save and Share!</h3>
<a class='stumble' expr:href='"http://www.stumbleupon.com/submit?url=" +data:post.url' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",6);"' target='_blank'>Stumble</a>
<a class='digg' expr:href='"http://digg.com/submit?phase=3&url=" + data:post.url' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",1);"' target='_blank'>Digg</a>
<a class='tweet' expr:href='"http://twitter.com/home?status=Check this out: " + data:post.url + " |" + data:blog.title' target='_blank'>Tweet</a>
<br/>
<br/>
<br/>
<br/>
<a class='save' expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",2);"' target='_blank'>Save</a>
<a class='reddit' expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",17);"' target='_blank'>Reddit</a>
<a class='more' href='http://www.addtoany.com/share_save'>More</a>
</div>
</div>
<div>
<div id='related-posts'>
<h3>Related Posts :</h3><b:loop values='data:post.labels' var='label'><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=4"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</div>
</div>
</div>
</b:if>
Posted by: Andi Setyoko
Berita Harian, Updated at: 5:48 PM
