Oto Website

Tambahkan Tombol Social Bookmarking dan Unit Iklan Adsense di Blogger

<span class="awal">T</span>utorial ini akan menunjukkan kepada Anda tentang Tambahkan Tombol Social Bookmarking dan Unit Iklan Adsense di Blogger. Keuntungan utama menggunakan widget ini adalah Anda dapat meningkatkan tayangan Adsense Anda atau klick iklan Anda dan mengisi ruang kosong di samping unit Adsense dengan Tombol Social Bookmarking, membuat blog Anda terlihat lebih indah dan profesional. Widget ini di lengkapi dengan tombol termasuk tombol untuk Google Plus, Del.icio.us, Twitter, Facebook, StumbleUpon dan Digg.<br />
<style>
.ow{
font-size:20px;
padding:5px;
font-family:consolas;
color:#ffffff;
text:1px 1px 1px #333;
background:#3e81c4;
border-left:20px solid #aa0000;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 1px 1px 2px #ccc;
-webkit-box-shadow: 1px 1px 2px #ccc;
box-shadow: 1px 1px 2px #333;
margin: 10px 0;
text-transform: capitalize;
width: 94%;
line-height:1;
</style><br />
<div class="YOUR HEADLINE CLASS i.e ow">PRIVIEW</div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiPTyyt7MUF_4_jqZH_FfcDzBxhwEJgRqYr7JZTDQJm4LuJXBxNNvb7P1C6398VNvE6qYnMKZoWO-2vONx9rxfneAczo17aJSf4J_HEgxmXpFwc5pjDSTkRlxw-3lmC4S8sRW8q98Pgg/s1600/social-bookmarking-icons-besides-adsense-ads.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="336" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiPTyyt7MUF_4_jqZH_FfcDzBxhwEJgRqYr7JZTDQJm4LuJXBxNNvb7P1C6398VNvE6qYnMKZoWO-2vONx9rxfneAczo17aJSf4J_HEgxmXpFwc5pjDSTkRlxw-3lmC4S8sRW8q98Pgg/s640/social-bookmarking-icons-besides-adsense-ads.jpg" width="640" /></a></div><style>
.ow{
font-size:20px;
padding:5px;
font-family:consolas;
color:#ffffff;
text:1px 1px 1px #333;
background:#3e81c4;
border-left:20px solid #aa0000;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 1px 1px 2px #ccc;
-webkit-box-shadow: 1px 1px 2px #ccc;
box-shadow: 1px 1px 2px #333;
margin: 10px 0;
text-transform: capitalize;
width: 94%;
line-height:1;
</style><br />
<div class="YOUR HEADLINE CLASS i.e ow">Cara Tambahkan Tombol Social Bookmarking dan Unit Iklan Adsense di Blogger</div><br />
<ul><li>Pergi ke <b><i>Blogger.com</i></b></li>
<li>Pada <b><i>Dasbor</i></b> klick >> Template</li>
<li>Centang <input checked="" id="expandWidgets" style="font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Helvetica, Sans, FreeSans, Jamrul, Garuda, Kalimati; font-size: small; margin: 0px 2px 4px; padding: 0.2em 0.4em;" type="checkbox" />Expand Template Widget >> Backup Template Anda.</li>
<li>Sekarang gunakan tool di bawah ini dan masukkan kode iklan Adsense Anda >> lalu tekan tombol Generate.</li>
</ul><iframe allowtransparency="true" frameborder="0" height="670px" scrolling="no" src="http://dl.dropbox.com/u/63702052/Social%20Bookmarking%20Buttons%20Beside%20Adsense%20Ad%20Unit%20Code%20Generator.html" width="100%"></iframe><br />
<ul><li>Kembali ke template Anda >> copy kode CSS yang telah di hasilkan Generator tadi dan letakkan di atas kode <b><i>]]></b:skin></i></b> (Bila kesulitan mencari kode HTML klick <a href="http://otowebsite.blogspot.com/2012/02/cara-cepat-mencari-kode-html.html" target="_blank">DISINI</a>).</li>
<li>Pencarian untuk kode <b><i><data:post.body/></i></b> dan copy kode HTML pada Generator tadi dan letakkan pada kode <data:post.body/></li>
<li>Simpan template Anda dan lihat hasilnya.</li>
</ul>

Tambahkan Tombol Social Bookmarking dan Unit Iklan Adsense di Blogger

Tutorial ini akan menunjukkan kepada Anda tentang Tambahkan Tombol Social Bookmarking dan Unit Iklan Adsense di Blogger. Keuntungan utama menggunakan widget ini adalah Anda dapat meningkatkan tayangan…

Baca selengkapnya »

16 Sep 2012

Awesome Page Navigation Widget Untuk Blogger Dengan Scroll

<span class="awal">A</span>wesome Page Navigation Widget Untuk Blogger Dengan Scroll adalah widget Navigasi halaman dan membantu pembaca Anda untuk melompat dari satu halaman ke halaman lain directly. Widget navigasi halaman ini dikembangkan oleh <a href="http://karaboz.ru/2007/11/19/paginator-3000-postranichnaya-navigaciya-budushhego/" target="_blank">karaboz</a> dan <a href="http://www.abu-farhan.com/" target="_blank">abu-farhan</a> dikonversi menjadi blogger. Widget ini memiliki tombol kecil di bawah dimana setiap pengunjung bisa langsung pada halaman terakhir , juga mereka dapat memilih halaman di blog.Search Anda di Google Anda akan melihat widget banyak tentang navigasi halaman tetapi jika Anda menggunakan widget ini maka pembaca / pengunjung bisa pergi ke halaman tertentu yang mereka inginkan.<br />
<br />
<style>
.ow{
font-size:20px;
padding:5px;
font-family:consolas;
color:#ffffff;
text:1px 1px 1px #333;
background:#3e81c4;
border-left:20px solid #aa0000;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 1px 1px 2px #ccc;
-webkit-box-shadow: 1px 1px 2px #ccc;
box-shadow: 1px 1px 2px #333;
margin: 10px 0;
text-transform: capitalize;
width: 94%;
line-height:1;
</style><br />
<div class="YOUR HEADLINE CLASS i.e ow">See Demo At Bottom Of My Homepage</div><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHBfrqhXKjj8BRrs20CB4YhnJs9TNnnfg9cWJjc3MDMlZkGBCT_nQmd1zbSHJHUep6Uo1dWS89ITt1_J_IkVcQ3i6v7-abg7-JHBECpItr0duAopL2ANI6qrSPAIuWe8zlHOvy1ymaYA/s1600/page-navigation-widget-for-blogger-pagination-in-blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="434" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHBfrqhXKjj8BRrs20CB4YhnJs9TNnnfg9cWJjc3MDMlZkGBCT_nQmd1zbSHJHUep6Uo1dWS89ITt1_J_IkVcQ3i6v7-abg7-JHBECpItr0duAopL2ANI6qrSPAIuWe8zlHOvy1ymaYA/s640/page-navigation-widget-for-blogger-pagination-in-blogger.png" width="640" /></a></div><br />
<style>
.ow{
font-size:20px;
padding:5px;
font-family:consolas;
color:#ffffff;
text:1px 1px 1px #333;
background:#3e81c4;
border-left:20px solid #aa0000;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 1px 1px 2px #ccc;
-webkit-box-shadow: 1px 1px 2px #ccc;
box-shadow: 1px 1px 2px #333;
margin: 10px 0;
text-transform: capitalize;
width: 94%;
line-height:1;
</style><br />
<div class="YOUR HEADLINE CLASS i.e ow">Cara Membuat Awesome Page Navigation Widget</div><br />
Berikut ini adalah kode-kode yang di gunakan untuk membuat Awesome Page Navigation Widget Untuk Blogger Dengan Scroll<br />
<br />
The CSS<br />
<br />
<pre class="brush:css;">.paginator {
 margin-top:60px;
 font-size:1em;
}
.paginator table {
 border-collapse:collapse;
 table-layout:fixed;
 width:100%;
}
.paginator table td {
 padding:0;
 white-space:nowrap;
 text-align:center;
}
.paginator span {
 display:block;
 padding:3px 0;
 color:#fff;
}
.paginator span strong,
.paginator span a {
 padding:2px 6px;
}
.paginator span strong {
 background:#ff6c24;
 font-style:normal;
 font-weight:normal;
}
.paginator .scroll_bar {
 width:100%; height:20px;
 position:relative;
 margin-top:10px;
}
.paginator .scroll_trough {
 width:100%; height:3px;
 background:#ccc;
 overflow:hidden;
}
.paginator .scroll_thumb {
 position:absolute;
 z-index:2;
 width:0; height:3px;
 top:0; left:0;
 font-size:1px;
 background:#363636;
}
.paginator .scroll_knob {
 position:absolute;
 top:-5px; left:50%;
 margin-left:-10px;
 width:20px; height:20px;
 overflow:hidden;
 background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaV2hMRr2uXatqQb47SuDDWfBFprxz5fxzE3tQUWoJ28ksv_gzDQ6sWxeGBARnR5aU60QUiVHKfbFq7vuYglvOMx20apFV4GgcdyBe-S3nbJz2ITci-i3FpNS9XiOSEbkZBzv0CsAkquE/s1600/slider_knob.gif) no-repeat 50% 50%;
 cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
 position:absolute;
 z-index:1;
 top:0; left:0;
 width:0; height:3px;
 overflow:hidden;
 background:#ff6c24;
}

.fullsize .scroll_thumb {
 display:none;
}

.paginator_pages {
 width:600px;
 text-align:right;
 font-size:0.8em;
 color:#808080;
 margin-top:-10px;
}</pre><br />
The JavaScript<br />
<br />
<pre class="brush:javascript;"><script src='https://otowebsite-blogspot.googlecode.com/svn/trunk/Awesome%20Page%20Navigation%2001.js' type='text/javascript'></script>
<script type='text/javascript'>
var home_page="/";
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=6;
</script>
<script src='https://otowebsite-blogspot.googlecode.com/svn/trunk/Awesome%20Page%20Navigation%2000.js' type='text/javascript'/></pre><br />

Awesome Page Navigation Widget Untuk Blogger Dengan Scroll

Awesome Page Navigation Widget Untuk Blogger Dengan Scroll adalah widget Navigasi halaman dan membantu pembaca Anda untuk melompat dari satu halaman ke halaman lain directly. Widget navigasi halaman i…

Baca selengkapnya »

07 Sep 2012

New Facebook Recommendation Bar Untuk Blogger

<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9tzQ1zq9fQrKYte3ysEv_cK2blAVNc0DIsaVZk4s8et7XgMtxluW3gkU3_iNMeXrBgZ5yHnbSToI2AkDMqD2jVClVmyuHel0wY3tR8Iu6jE3YnYGh1I1OIt7m4t_8AcPQAIG7xHPMnQ/s1600/tes.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9tzQ1zq9fQrKYte3ysEv_cK2blAVNc0DIsaVZk4s8et7XgMtxluW3gkU3_iNMeXrBgZ5yHnbSToI2AkDMqD2jVClVmyuHel0wY3tR8Iu6jE3YnYGh1I1OIt7m4t_8AcPQAIG7xHPMnQ/s1600/tes.png" /></a></div><span class="awal">D</span>alam perjumpaan kali ini saya akan berbagi sebuah tutorial dan untuk tutorial kali ini saya beri judul <a href="http://otowebsite.blogspot.com/2012/09/new-facebook-recommendation-bar-untuk.html">New Facebook Recommendation Bar Untuk Blogger</a>. Ini sebenarnya Updatean dari artikel sebelumnya yang berada di tutorial <a href="http://otowebsite.blogspot.com/2012/07/tambahkan-facebook-recommendation-bar.html" target="_blank">Tambahkan Facebook Recommendation Bar Untuk Blogger</a>.<br />
<br />
Karna artikel tersebut sekarang sudah tidak berjalan dengan sempurna untuk itu saya update tutorialnya disini. Jika Anda sebelumnya sudah membaca artikel sebelumnya maka saya tidak perlu lagi menjelaskan untuk apa dan fungsi widget Facebook Recommendation Bar bila di pasang di blogger Anda.<br />
<br />
Facebook Rekomendasi Bar Ini adalah Plugins Beta. <br />
Dalam tutorial ini, kita pergi untuk belajar cara menginstal Facebook Bar Rekomendasi di Blog Blogger. Widget ini lebih bermanfaat untuk mengarahkan lalu lintas dari Facebook dan sejenisnya dengan instan dan posting terkait.<br />
<style>
.ow{
font-size:20px;
padding:5px;
font-family:consolas;
color:#ffffff;
text:1px 1px 1px #333;
background:#3e81c4;
border-left:20px solid #aa0000;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 1px 1px 2px #ccc;
-webkit-box-shadow: 1px 1px 2px #ccc;
box-shadow: 1px 1px 2px #333;
margin: 10px 0;
text-transform: capitalize;
width: 94%;
line-height:1;
</style><br />
<div class="YOUR HEADLINE CLASS i.e ow">PRIVIEW</div><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZxMnOD0-o3zRCVAek4oy2kEspRpi3EeLTcnxo9q-gWdNrBKFAE9y7avRIW7sEKXuvVwD-KsvlflYTRiWakPDeoMPA_9OiDAoRHkCTaN0O8ES9-GHYEHEDWJE6KpbEWsZfBiSXRBWe1g/s1600/demo.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZxMnOD0-o3zRCVAek4oy2kEspRpi3EeLTcnxo9q-gWdNrBKFAE9y7avRIW7sEKXuvVwD-KsvlflYTRiWakPDeoMPA_9OiDAoRHkCTaN0O8ES9-GHYEHEDWJE6KpbEWsZfBiSXRBWe1g/s1600/demo.jpg" /></a></div><br />
<style>
.ow{
font-size:20px;
padding:5px;
font-family:consolas;
color:#ffffff;
text:1px 1px 1px #333;
background:#3e81c4;
border-left:20px solid #aa0000;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-box-shadow: 1px 1px 2px #ccc;
-webkit-box-shadow: 1px 1px 2px #ccc;
box-shadow: 1px 1px 2px #333;
margin: 10px 0;
text-transform: capitalize;
width: 94%;
line-height:1;
</style><br />
<div class="YOUR HEADLINE CLASS i.e ow">CARA INSTAL WIDGET FACEBOOK RECOMMONDATIONS BAR DI BLOGGER?</div><br />
1. Pertama Tambahkan kode berikut sebelum kode <b><head></b><br />
<br />
<blockquote class="tr_bq"><br />
<b:if cond='data:blog.pageType == "item"'><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><meta content='article' property='og:type'/><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><meta expr:content='data:blog.title' property='og:site_name'/><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><meta expr:content='data:blog.pageName' property='og:title'/><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><b:if cond='data:blog.postImageThumbnailUrl'><br />
<span class="Apple-tab-span" style="white-space: pre;">  </span><meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span></b:if><br />
<b:else/><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><meta expr:content='data:blog.title' property='og:title'/><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><meta content='website' property='og:type'/><br />
</b:if><br />
<meta expr:content='"en_US"' property='og:locale'/><br />
<meta expr:content='data:blog.canonicalUrl' property='og:url'/><br />
</blockquote><br />
2. Kedua Pergi ke <a href="https://developers.facebook.com/docs/reference/plugins/recommendationsbar/" target="_blank">Halaman Resmi Facebook Rekomendasi Bar</a>.<br />
<br />
3. Lansung klick tombol <b>Get Code</b>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoccMTaOJb0w0iUCWOrE1pzmZO8qfRZE-JUWTS_Vc7Oj_8YU1jxEZdGOigNNLRS3GtXu63xYIo33e79vG_TWP4Mru3GXBLvH1tpSoQ5pwyUFxu-Wu6s7LXNwjjGlAWQzm_3QoATzUA1g/s1600/f1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoccMTaOJb0w0iUCWOrE1pzmZO8qfRZE-JUWTS_Vc7Oj_8YU1jxEZdGOigNNLRS3GtXu63xYIo33e79vG_TWP4Mru3GXBLvH1tpSoQ5pwyUFxu-Wu6s7LXNwjjGlAWQzm_3QoATzUA1g/s1600/f1.png" /></a></div><br />
4. Klick Tautan <b>buat aplikasi baru.</b><br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTEQYpGQo4pDwdIVNpKX3MCgtRB-m3O3cIXBkxAIJJ4lSvBhELwCfjTwyX-ZVXkTemsD5tZW8czB1GnnciguKB03p4Ja2IDdnWFEH5d9mTWo4Ny148g6z_XG952wxebcNfUEj_tfLS9g/s1600/f2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTEQYpGQo4pDwdIVNpKX3MCgtRB-m3O3cIXBkxAIJJ4lSvBhELwCfjTwyX-ZVXkTemsD5tZW8czB1GnnciguKB03p4Ja2IDdnWFEH5d9mTWo4Ny148g6z_XG952wxebcNfUEj_tfLS9g/s1600/f2.png" /></a></div><br />
5. Masukkan <b>Nama App</b> dengan Judul Blog Anda dan <b>URL Web</b> dengan URL Blog Anda, seperti seperti di bawah ini dan klik tombol <b>Lanjutkan</b>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhD58fEb1YF8PCVdEWFXKsfE9JG5Op2EqIFhrmsQ6gU0c3XEFM5Gq4-6TGwpoaLDfhhi7ik6EWiu9hxUHVmaSorpGi34cI0KKdsAe1tebijLl7ZxaBaS5cTu0mpP7o8pG_vXwHIsG6Dg/s1600/f3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhD58fEb1YF8PCVdEWFXKsfE9JG5Op2EqIFhrmsQ6gU0c3XEFM5Gq4-6TGwpoaLDfhhi7ik6EWiu9hxUHVmaSorpGi34cI0KKdsAe1tebijLl7ZxaBaS5cTu0mpP7o8pG_vXwHIsG6Dg/s1600/f3.png" /></a></div><br />
6. Masukkan Kode Captcha dengan benar dan klik tombol <b>Kirim</b>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgia7woK6Zvx32Y0TiDIfu79nZ0OSwn3v1NUIdN-nZhiQHaHWLQMrQP3lZhL-tPSSpp8Fil5-pd51Y2oZQUxDvFfTNLFqARSvWWlw317Ltkvwh3KoZg4y4qUpfsEpm8q03RrzZu52I3JQ/s1600/f4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgia7woK6Zvx32Y0TiDIfu79nZ0OSwn3v1NUIdN-nZhiQHaHWLQMrQP3lZhL-tPSSpp8Fil5-pd51Y2oZQUxDvFfTNLFqARSvWWlw317Ltkvwh3KoZg4y4qUpfsEpm8q03RrzZu52I3JQ/s1600/f4.png" /></a></div><br />
7. Kemudian Klik Tombol <b>Get Code</b> sekali lagi.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLtqgF_ZytSslYIEj9DS65pY23slcwDlwQEqL1vofYKyV2Dlhfr5_cC2UamGxg6h0fEOM1_kdbpo-Hfzdrq_puZJk54uALOs4qNXYsH06BFizmSh1Qt1aQyqL85J8rNmXbiYAMBYJ9Cg/s1600/f6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLtqgF_ZytSslYIEj9DS65pY23slcwDlwQEqL1vofYKyV2Dlhfr5_cC2UamGxg6h0fEOM1_kdbpo-Hfzdrq_puZJk54uALOs4qNXYsH06BFizmSh1Qt1aQyqL85J8rNmXbiYAMBYJ9Cg/s1600/f6.png" /></a></div><br />
8. Salin kode JavaScript Pertama SDK (Kode Kotak Pertama) dan Encode Kode tersebut menggunakan Alat <a href="http://otowebsite.blogspot.com/2012/03/parse-kode-html-atau-script.html" target="_blank">Parse Kode Script atau HTML</a>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-HSPXBG-a3ggkGWZsQrmrKKF9KJcY1ymKsUFtRdW_McQghLJbuhOHbbtCytB6n-iSVb8pZyRo_H2tY947mOFZNRr40eCl2srYjxc8jJKLsVpfy1tx7ld_-l1DsMC1zGx-iXfxyUd3zg/s1600/f5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-HSPXBG-a3ggkGWZsQrmrKKF9KJcY1ymKsUFtRdW_McQghLJbuhOHbbtCytB6n-iSVb8pZyRo_H2tY947mOFZNRr40eCl2srYjxc8jJKLsVpfy1tx7ld_-l1DsMC1zGx-iXfxyUd3zg/s1600/f5.png" /></a></div><br />
9. Masuk ke akun <b>Blogger</b> Anda >> Pilih Template >> <b>Edit HTML</b> .<br />
<br />
10. Centang <input checked="" id="expandWidgets" style="font-size: small;" type="checkbox" /><b>Expand Template Widget</b> >> <b>Backup Template Anda</b>.<br />
<br />
11. Cari kode <b><body></b> dan letakkan kode yang Anda dapatkan tadi tepat di atasnya. (Bila kesulitan mencari kode HTML klick <a href="http://otowebsite.blogspot.com/2012/02/cara-cepat-mencari-kode-html.html" target="_blank">DISINI</a>)<br />
<br />
12. Kustomisasi <b>Facebook Rekomendasi Bar</b>:<br />
Anda dapat menyesuaikan pengaturan Facebook Rekomendasi Bar<br />
<br />
Cari kode <b><data:post.body/></b> dan menempatkan kode berikut setelah kode <data:post.body/><br />
<br />
<blockquote class="tr_bq"><b:if cond='data:blog.pageType == "item"'><div class="fb-recommendations-bar" data-trigger="onvisible" expr:data-href="data:post.url" data-read-time="<span style="background-color: yellow;">30</span>" data-action="like" data-side="<span style="background-color: #45818e;">right</span>" expr:data-site="data:blog.homepageUrl" data-num-recommendations="<span style="background-color: #38761d;">2</span>"></div></b:if></blockquote><br />
<b>Keterangan:</b><br />
<ul><li>Angka <span style="background-color: yellow;">30</span> menunjukkan widget Facebook Recommendation Bar akan muncul setelah 30 detik.</li>
<li>Anda dapat mengatur berapa banyak artikel untuk ditampilkan. Dengan meningkatkan atau menurunkan nilai <span style="background-color: #38761d;">2</span></li>
<li>Anda dapat memutuskan lokasi plugin. Secara default itu muncul di bagian bawah  <span style="background-color: #45818e;">right</span> = kanan sudut halaman Anda. Anda menetapkan mengapung ke ke left = kiri.</li>
</ul><br />
13. Simpan template.<br />
<br />
Sekarang Anda bisa menikmati widget <a href="http://otowebsite.blogspot.com/2012/09/new-facebook-recommendation-bar-untuk.html">New Facebook Recommendation Bar Untuk Blogger</a> ini!

New Facebook Recommendation Bar Untuk Blogger

Dalam perjumpaan kali ini saya akan berbagi sebuah tutorial dan untuk tutorial kali ini saya beri judul New Facebook Recommendation Bar Untuk Blogger. Ini sebenarnya Updatean dari artikel sebelumnya y…

Baca selengkapnya »

01 Sep 2012

Oto Website

Tambahkan Tombol Social Bookmarking dan Unit Iklan Adsense di Blogger

Awesome Page Navigation Widget Untuk Blogger Dengan Scroll

New Facebook Recommendation Bar Untuk Blogger

Entri Populer

Arsip Blog