Cari Artikel

March 22, 2013

Memasang Related Post (Artikel Terkait) Sederhana di Blog

Anda mungkin sudah membacar artikel saya sebelumnya yang berjudul memasang related post (artikel terkait) bergambar di blog. Nah, saya akan melanjutkan pembahasan mengenai related post, kali ini saya akan membahas tentang memasang related post (artikel terkait) sederhana di blog. Related post yang satu ini hanya berupa daftar list artikel yang berhubungan dengan postingan anda. Meskipun sederhana,  related post ini masih tetap terlihat keren dengan latar biru dan garis biru di awal list.

related post

Memasang Related Post (Artikel Terkait) Sederhana di Blog

Step 1

Masuk ke halaman dashboard > Template > HTML > Expand widget template

Step 2

Letakkan kode berikut tepat di atas kode </head>
<!--Awal Kode Related Posts-->
<!--Hapus--><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
margin-top: 20px;
}
#related-posts .widget{
padding-left:6px;
margin-bottom:10px;
}
#related-posts .widget h2, #related-posts h2{
font-size: 17px;
font-weight: normal;
color: black;
font-family: Arial Narrow;
margin-bottom: 0.75em;
padding-top: 0em;
}
#related-posts a{
font-size:16px;
color: #555555;
font-variant:small-caps;
}
#related-posts a:hover{
text-decoration: none;
color: #ffffff;
font-weight: bold;
}
#related-posts ul{
list-style-type:none;
margin:0 0 0px 0;
padding:0px;
text-decoration:none;
text-color:#000000
}
#related-posts ul li{
list-style-type: none;
border-left: 2px solid #1399CF;
border-bottom: 1px dotted #1399CF;
margin-bottom: 3px;
padding-left: 30px;
padding-top:0px;
}

#related-posts ul li:hover{
background-color: #1399CF;
border-left: 2px solid #B3CA3D;
border-bottom: 1px dotted #B3CA3D;
}
</style>
<script type='text/javascript'>
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script src='http://the-kampoeng-blogger.googlecode.com/files/relatedpostsederhana.js' type='text/javascript'/>
<!--Hapus--></b:if>
<!--Akhir kode Related Post-->
Catatan!
Anda dapat memodifikasi warna background dan border dari list/daftar related post dengan mengganti kode warna yang berwarna biru dengan kode warna yang lain (Lihat kode warna HEX dan RGB HTML)

Step 3

Letakkan kode berikut tepat di atas kode <div class='post-footer'>
<!-- Awal Kode Related Post-->
<!--Remove-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != &quot;true&quot;'> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> var maxresults=5; removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;); </script> </div> <!--Remove--></b:if> <!-- Akhir Kode Related Post-->
Catatan!
Anda dapat mengganti jumlah list berdasarkan label dengan mengganti  maxresults=5 dengan jumlah list yang anda inginkan.

Step 4
Klik Save Template

Semoga bermanfaat.
Wassalam. 

Memasang Related Post (Artikel Terkait) Bergambar (Thumbnail) di Blog

Menambahkan related post (artikel terkait) akan membuat pengunjung anda bereksplorasi di blog anda. Pengunjung akan lebih lama mengunjungi blog anda dan dapat melihat artikel-artikel menarik di dalam blog anda dari related post ini. Tentu saja ini akan baik bagi blog anda, karena bila pengunjung merasa blog anda adalah salah satu referensi yang bagus untuk dibaca, maka mungkin anda akan mendapatkan promosi gratis dari pengunjung.
related post

Untuk memasangnya anda perlu melakukan beberapa langkah. Berikut adalah langkah dalam memasangnya di blog.

Memasang Related Post (Artikel Terkait) Bergambar (Thumbnail)

Sebelum melakukan perubahan pada halaman HTML Template, sebaiknya anda mem-backup template anda terlebih dahulu.

Step 1

Masuk ke halaman dashboard > Template > HTML > Expand widget template

Step 2

Letakkan kode berikut tepat di atas kode </head>
<!--Awal Kode Related Posts Bergambar by www.thekampoengblogger.blogspot.com -->
<!-- hapus --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 18px;
letter-spacing: 2px;
font-weight: bold;
text-transform: none;
color: #5D5D5D;
font-family: Arial Narrow;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
border-right: 1px dotted #DDDDDD;
color:#5D5D5D;
}
#related-posts a:hover{
color:black;
background-color:#EDEDEF;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quothttps://lh4.googleusercontent.com/-BLn1tWYPSJs/UTh11-QM3SI/AAAAAAAAA9c/3vkQZ7gmDd4/s84/no%2520image.png&quot;;
var maxresults=5;
var splittercolor=&quot;#DDDDDD&quot;;
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script src='http://the-kampoeng-blogger.googlecode.com/files/relatedpostbergambar.js' type='text/javascript'/>
<!-- hapus --></b:if>
<!--Akhir Kode Related Posts Bergambar-->

Step 3

Letakkan kode berikut tepat di atas kode <div class='post-footer'>
<!-- Awal Kode Related Posts Bergambar-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=5&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://thekampoengblogger.blogspot.com'><img alt='Tips Blog' src='http://3.bp.blogspot.com/-K65p5zLLKQk/T3ObCINoP7I/AAAAAAAABmI/dF84-alnOu4/s1600/best+blogger+tips.png'/></a>
</b:if></b:if>
<!--Akhir Kode Related Posts Bergambar by www.thekampoengblogger.blogspot.com-->

Step 4

Klik Save Template

Semoga bermanfaat.
Wassalam.
 

March 21, 2013

Buat Komentarmu Lebih Seru dengan Smiley!

Smiley merupakan emoticon-emoticon lucu, yang biasanya digunakan untuk mengekspresikan perkataan seseorang. Smiley sangat bagus untuk membuat diskusi komentar menjadi lebih menarik dan menyenangkan. Dengan menggunakan smiley pada komentar, anda tentunya lebih dapat mengekspresikan apa yang ingin anda katakan kepada orang lain. Pada kesempatan kali ini saya akan memberikan tips mengenai bagaimana cara memasang smiley kolobok yang lucu di kolom komentar sehingga membuat kolom komentar anda lebih menarik dan menyenangkan.

smiley

Memasang Emoticon Kolobok di Kolom Komentar Blog

Step 1

Masuk ke halaman dashboard > Template > HTML >Expand widget template

Step 2

Letakkan kode berikut di atas kode  </body>
<script src='https://helplogger.googlecode.com/svn/trunk/kolobok threaded.js' type='text/javascript'/>

Step 3

Letakkan kode berikut tepat di bawah kode <div class='post-footer-line post-footer-line-3'>
<b:if cond='data:blog.pageType == &quot;item&quot;'><script type='text/javascript'>
//<![CDATA[
function moreSmilies() {
document.getElementById('smiley-more').style.display = 'inline';
document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:lessSmilies()"><div style="font-size:small; font-weight:bold;color:#000000;">Hide Emoticons /<a href="http://helplogger.blogspot.com/2012/04/how-to-add-emoticonssmileys-in-blogger.html">Add Emoticons</div></a></span>';
}

function lessSmilies() {
document.getElementById('smiley-more').style.display = 'none';
document.getElementById('smiley-toggle').innerHTML = '<a href="javascript:moreSmilies()"><div style="font-size:small; font-weight:bold;">Show Emoticons</div></a>';

}
//]]>
</script>
<div class='emoticons'>
<span id='smiley-more' style='display: none;'>
<img src='http://4.bp.blogspot.com/-k4ujC23cSgI/UTIq7eUkmuI/AAAAAAAABAQ/YUNL9_RhDB0/s1600/smile3.gif'/>:)
<img src='http://2.bp.blogspot.com/-XSBJ7zBZKZs/UTIrT-hMYyI/AAAAAAAABAY/6B26_8Ttwj4/s1600/sad.gif'/>:(
<img src='http://2.bp.blogspot.com/-Ph2wxEvy2mc/UTIr8-fdHjI/AAAAAAAABAo/3use2PsPhMA/s1600/taunt.gif'/>:))
<img src='http://3.bp.blogspot.com/-pcE-4ot-gjk/UTIsLRff6SI/AAAAAAAABAw/LYvZ8__88Ak/s1600/cry2.gif'/>:((
<img src='http://1.bp.blogspot.com/-lNNTReQVc0A/UTIrjDhVLAI/AAAAAAAABAg/BsVMYnr54pI/s1600/rofl.gif'/>=))
<img src='http://1.bp.blogspot.com/-8C5UH12mxf0/UTIzmsxczDI/AAAAAAAABDA/2seHdqLVQ6Q/s1600/suicide.gif'/>=D&gt;
<img src='http://4.bp.blogspot.com/-lhTywmMZ58E/UTI04kjJ3WI/AAAAAAAABDY/qNgtijEr_E8/s1600/biggrin.gif'/>:D
<img src='http://1.bp.blogspot.com/-gG_Wn6D6Ux4/UTIyqFyfKbI/AAAAAAAABCo/qEmU8s8ndVI/s1600/tongue.gif'/>:P
<img src='http://3.bp.blogspot.com/-Zb5g0OWHx4c/UTIsuPLt90I/AAAAAAAABA4/cmP1ltBmVF0/s1600/shock.gif'/>:-O
<img src='http://1.bp.blogspot.com/-TSIzPWeGBwk/UTI0S-nw5tI/AAAAAAAABDQ/xyHPCFZH4fI/s1600/think.gif'/>:-?
<img src='http://1.bp.blogspot.com/-qpnD1BYon5w/UTI0AIeKX6I/AAAAAAAABDI/HsllV7NYTqk/s1600/unsure.gif'/>:-SS
<img src='http://4.bp.blogspot.com/-SpvC8mHHwhg/UTIzQMUVGKI/AAAAAAAABCw/_NKKVyQtulk/s1600/flowers1.gif'/>:-f
<img src='http://3.bp.blogspot.com/-qlyn_deOhFw/UTIzY8aRgqI/AAAAAAAABC4/pfSojMdD33s/s1600/doh.gif'/>d(
<img src='http://2.bp.blogspot.com/-H4e_O5BFVP8/UTIumwhVmKI/AAAAAAAABBw/SKhY4DDxKkk/s1600/air_kiss.gif'/>:-*
<img src='http://3.bp.blogspot.com/-h4yNmhdKUVU/UTIwUKpvVOI/AAAAAAAABCY/B0FEZVRGHe4/s1600/threaten.gif'/>b-(
<img src='http://4.bp.blogspot.com/-veVoDPEc7I4/UTIv9wCS0jI/AAAAAAAABCQ/4c5FgCHAiU4/s1600/help.gif'/>h-(
<img src='http://2.bp.blogspot.com/-_ttAcnBbAaw/UTIvKtxfWvI/AAAAAAAABCA/X2JLEShhOQU/s1600/good.gif'/>g-)
<img src='http://2.bp.blogspot.com/--o9jZ1nMcec/UTIuyCBgS_I/AAAAAAAABB4/Jf03oz5yKrU/s1600/beee.gif'/>5-p
<img src='http://2.bp.blogspot.com/-6-BTJcVpwY0/UTIvhF_PL-I/AAAAAAAABCI/SS-LDADTSls/s1600/yahoo.gif'/>y-)
<img src='http://3.bp.blogspot.com/-khAwhIYbgvQ/UTItD_PfNyI/AAAAAAAABBI/HMpRMQh5Uak/s1600/crazy.gif'/>c-)
<img src='http://2.bp.blogspot.com/-fsTXhXl10Gg/UTIs7Ll01AI/AAAAAAAABBA/QkWgWAAFG3g/s1600/spiteful.gif'/>s-)
<img src='http://2.bp.blogspot.com/-CIuUuJeuyGI/UTIueHgTxOI/AAAAAAAABBo/BzXkTEEDlhw/s1600/drinks.gif'/>d-)
<img src='http://2.bp.blogspot.com/-Mc5ed3Ymk7s/UTI1GIXMAMI/AAAAAAAABDg/PyDOfoXgsl0/s1600/cheer.gif'/>w-)
<img src='http://2.bp.blogspot.com/-JOgaMRI61Jk/UTItsGc5KdI/AAAAAAAABBY/6UDCabfZQbg/s1600/hi+2.gif'/>:-h
<img src='http://2.bp.blogspot.com/-wmOB_Z6LPp4/UTIt9FhZiwI/AAAAAAAABBg/7VoefgIQjEs/s1600/give_heart.gif'/>:X
</span>
<span id='smiley-toggle'><a href='javascript:moreSmilies()'><div style='font-size:small;font-weight:bold;'>Show Emoticons <img src='http://4.bp.blogspot.com/-k4ujC23cSgI/UTIq7eUkmuI/AAAAAAAABAQ/YUNL9_RhDB0/s1600/smile3.gif'/></div></a></span>
</div></b:if>

 Step 3

Klik Save Template

March 20, 2013

30+ Efek Blog Paling Dicari Oleh Blogger!

Malam ini saya akan melanjutkan postingan saya tentang efek blog. Di blog, banyak sekali efek blog yang di buat oleh desainer efek agar bisa mempercanti blog-blog yang ada. Tapi tetap saja, meskipun menarik memasang efek di blog seringkali membuat blog menjadi bertambah beban loadingnya. Sebagai saran saja, bila anda ingin memasang efek pada blog anda, maka sebaiknya anda hanya menempatkan satu efek saja pada blog anda, karena bila efek blog anda terlalu banyak, maka kemungkinan besar blog anda akan lama loadingnya. Bijaksanalah dalam memilih efek blog yang akan anda pasangkan di blog anda. Berikut ini adalah kumpulan 50+ efek blog paling dicari oleh blogger. Semoga bisa menambah indah blog anda.

efek blog

Efek Ringan 

Cara Memasangnya di Blog

Step 1

Masuk ke halaman dashboard > Template > HTML > Expand widget template

Step 2

Letakkan kode efek diatas kode </body>

Step 3

Klik Save Template

Hati Berjatuhan

<script src='http://the-kampoeng-blogger.googlecode.com/files/hatiberjatuhan.js' type='text/javascript'></script>

Kupu-kupu Terbang

<script src='http://the-kampoeng-blogger.googlecode.com/files/Kupu-kupu.js' type='text/javascript'></script>

Salju

<script src='http://the-kampoeng-blogger.googlecode.com/files/Salju.js' type='text/javascript'></script>

Kembang Api

 <script src='http://the-kampoeng-blogger.googlecode.com/files/kembang-api.js' type='text/javascript'></script>

Gelembung

<script src='http://the-kampoeng-blogger.googlecode.com/files/gelembung.js' type='text/javascript'></script>

Bertabur Bintang

<script src='http://the-kampoeng-blogger.googlecode.com/files/bertabur%20bintang.js' type='text/javascript'></script>

Efek Berat

Cara Memasangnya di Blog

Step 1

Masuk ke halaman dashboard > Layout > Add gadget > HTML/JavaScript

Step 2

Masukkan kode script efek ke dalam halaman HTML/JavaScript

Step 3

Klik Save

Meteor Jatuh

<script language="javascript">
nd_mode="meteor";
nd_control="on";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/meteor%20jatuh.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Bunga Mekar

<script language="javascript">
nd_mode="flowers";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20bunga%20mekar.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Bom Atom

<script language="javascript">
nd_mode="bomb";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20bom%20atom.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div> 

 Banjir

<script language="javascript">
nd_mode="flood";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek-banjir.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Graffiti

<script language="javascript">
nd_mode="graff";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20graffity.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Senjata

<script language="javascript">
nd_mode="gun";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/Efek%20Senjata.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Ufo

<script language="javascript">
nd_mode="ufo";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20ufo.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Shaver

<script language="javascript">
nd_mode="shaver";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20shaver.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Bloody Gun

<script language="javascript">
nd_mode="blood";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/Efek%20Bloody%20Gun.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

Paint Ball

<script language="javascript">
nd_mode="paint";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/Efek%20Paint%20Ball.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Chainsaw

<script language="javascript">
nd_mode="chainsaw";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20chainsaw.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Dinosaurus

<script language="javascript">
nd_mode="dino";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20dinosaurus.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Lebah

<script language="javascript">
nd_mode="wasp";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/Efek%20Lebah.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Lalat

<script language="javascript">
nd_mode="fly";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Semut

<script language="javascript">
nd_mode="ants";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/Efek%20semut.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Siput

<script language="javascript">
nd_mode="snail";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/Efek%20siput.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Cacing

<script language="javascript">
nd_mode="worms";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20cacing.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Mold

<script language="javascript">
nd_mode="mold";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20mold.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Bayi Merangkak

<script language="javascript">
nd_mode="baby";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20bayi%20merangkak.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Telur Mata Sapi

<script language="javascript">
nd_mode="eggs";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20telur%20mata%20sapi.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Kopi Tumpah

<script language="javascript">
nd_mode="coffee";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efekkopitumpah.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Terbakar

<script language="javascript">
nd_mode="burn";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20terbakar.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Tomat

<script language="javascript">
nd_mode="tomato";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20tomat.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

Creampie

<script language="javascript">
nd_mode="creampie";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efek%20creampie.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://thekampoengblogger.blogspot.com" target="_blank">Efek Blog</a></center></small></div>

 Murka

<script language="javascript">
nd_mode="god";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://the-kampoeng-blogger.googlecode.com/files/efekmurka.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html" target="_blank">Efek Blog</a></center></small></div>

Bunga Mawar 1

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><script src="http://spiceupyourblogextras.googlecode.com/files/spiceupyourblogrosethin.js" type="text/javascript">
/***********************************************

* Flower fall effect by Paul Crowe @ http://www.spiceupyourblog.com
* Please keep this notice intact

***********************************************/
</script><a href="http://www.spiceupyourblog.com" target="_blank"><font size="1">Get Flower Effect</font></a>

Bunga Mawar 2

<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><script src='http://spiceupyourblogextras.googlecode.com/files/spiceupyourblogrosefull.js' type='text/javascript'>
/***********************************************
* Flower fall effect by Paul Crowe http://www.spiceupyourblog.com
***********************************************/
</script><a href='http://www.spiceupyourblog.com' target='_blank'><font size='1'>Blogger Flower Effect</font></a>

March 19, 2013

Tragedi Penghapusan Blog The Kampoeng Blogger Oleh Blogger

Dua hari yang lalu, blog saya ini, the kampoeng blogger, dihapus oleh blogger dengan alasan di blog saya terdapat aktifitas mencurigakan yang dianggap spam oleh detektornya. Saya benar-benar kaget, saya tidak tahu mengapa Google menganggap blog saya ini spam, hacker bukan, spammer bukan, tapi koq dianggap sebagai spam, benar-benar aneh.

Pertama kali saya mengetahui kalau blog saya dihapus oleh blogger adalah saat saya masuk ke situs blog saya dan saya mendapati pesan bahwa blog saya telah terhapus (????). Bukan main kagetnya saya, saya periksa halaman dashboard saya, dan benar saja, blog the kampoeng blogger sudah masuk dalam daftar blog yang dihapus. Segera saja saya surfing di internet untuk mencari informasi mengapa blog saya bisa terhapus dan bagaimana agar blog saya bisa dikembalikan seperti sedia kala. Awalnya saya mengira bahwa blog saya mungkin dimasukkan dalam sandbox di google, tapi saya berpikir bahwa tulisan-tulisan saya di blog ini adalah murni tulisan saya sendiri, jadi tidak mungkin blog saya dimasukkan di sandbox google. Setelah mencari keman-mana, akhirnya saya mendapatkan sebuah artikel di sebuah blog yang ternyata memiliki pengalaman yang sama dengan saya. Ternyata blog saya dihapus karena detektor spam otomatis di blogger salah mengira tentang blog saya, pemilik blog yang juga blognya terhapus lalu mengajukan banding kepada blogger agar bisa mengembalikan blognya kembali, alhasil setelah mengirimkan email keberatan ke blogger, akhirnya si empunya blog dikirimi surat balasan dari blogger yang menyatakan permintaan maafnya atas kesalahan dalam mendeteksi blog yang mengandung spam.

Alhamdulillah, dari artikel tersebut akhirnya saya tahu, blog saya bisa kembali seperti semula. Akan tetapi saya tidak menganjungkan banding seperti yang dilakukan oleh blogger tersebut. Saya berusaha untuk kembali ke halaman dashboard saya dan menekan tombol restore di samping blog saya yang terhapus. Saya lalu mendapat notifikasi bahwa blogger akan melakukan review kembali terhadap blog saya, dan untuk itu saya harus bersedia menunggu selama dua hari.

Tidak sampai dua hari (tepatnya besoknya/hari ini) saya mendapatkan email pemberitahuan bahwa blogger telah salah dalam mengidentifikasi blog saya, dan untuk itu, blogger memberikan pernyataan maafnya kepada saya atas kesalahannya tersebut. Saya coba buka blog saya lagi, dan voila! alhamdulillah blog saya sudah kembali seperti semula. Saya coba cari blog saya di search engine, dan ternyata blog saya juga sudah kembali terindeks seperti semula. Alhamdulillah.

Saya benar-benar senang blog saya bisa kembali. Blog ini adalah salah satu blog kesayangan saya. Dan rasanya akan benar-benar tidak nyaman bila blog ini harus terhapus dengan sebab yang tak jelas.

Begitulah, akhirnya saya visa menulis lagi di blog ini. Ini adalah postingan pertama saya sejak blog ini terhapus. Semoga kedepannya kejadian penghapusan blog tidak terjadi lagi pada saya. Aamiin.

March 17, 2013

Memodifikasi Loading Page Blog Dengan Efek

Saat anda mengunjungi sebuah blog, sebelum masuk ke halaman blog,  anda akan menemukan bahwa saat loading akan terlihat halaman putih saja, blank page ini akan hilang bila halaman telah selesai loading. Anda mungkin berpikir bahwa halaman loading tidak dapat diganti dengan animasi sehinggaanda tidak bosan saat anda menunggu hingga halaman selesai loading. Tapi tahukah anda? anda dapat memodifikasi loading page ini dengan menggunakan kode tertentu dan memasang animasi yang anda inginkan di dalamnya. Apakah anda penasaran? Silahkan anda simak caranya berikut ini.

loading page

Cara Memasangnya di Blog

Sebelum anda melakukan perubahan pada halaman HTML Template, sebaiknya anda mem-backup template anda terlebih dahulu. 

Step 1

Masuk ke halaman dashboard > Template > HTML > Expand widget template

Step 2

Letakkan kode berikut tepat di atas kode ]]></b:skin>
    /*  TKB Page Loading Effect (www.thekampoengblogger.blogspot.com) */
    #TKBloadingeffect {
        position: fixed;
        z-index: 50;
        top: 0; left: 0;
        width: 100%; height: 100%;
        background: #FDFEF8 url(URL Gambar Loading GIF disini) no-repeat center;
        line-height: 350px;
        text-align: center;
        font-size: 36px;
        color: #353231;
        text-indent: -9999px;
    }
    .MD #TKBloadingeffect { display: none; }
    @media only screen and (device-width: 768px) {
        #loading {
            position:absolute;
            width:1040px;
            min-height:768px;
        }
    }
    #TKBprogressbar {
        position: absolute;
        top: 0; left: 0;
        background: #de1301;
        opacity: 0.8;
        width: 0;
        height: 18px;
    }
    #TKBloader {
        height: 100%;
        display: none;
    }

Step 3

Letakkan kode berikut tepat di atas kode </head>
     <script>
    (function($){
    $("html").removeClass("MD");

    $("#header").ready(function(){ $("#TKBprogressbar").stop().animate({ width: "25%" },1500) });
    $("#footer").ready(function(){ $("#TKBprogressbar").stop().animate({ width: "75%" },1500) });

    $(window).load(function(){
        $("#TKBprogressbar").stop().animate({ width: "100%" },600,function(){
            $("#mbl-lazyloading").fadeOut("fast",function(){ $(this).remove(); });
        });
    });
    })(jQuery);
    </script>

 Step 4

Letakkan kode berikut di atas kode </body>
  • Bila anda ingin Loading Page ini tampil hanya pada halaman Homepage saja, maka copy kode berikut
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='TKBloadingeffect'><div id='TKBprogressbar'></div><div id='TKBloader'>This Loading Effect is Powered By<a href="http://thekampoengblogger.blogspot.com">Blogger</a></div></div></b:if>

  • Bila anda ingin Loading Page ini tampil pada semua halaman, maka copy kode berikut
<div id='TKBloadingeffect'><div id='TKBprogressbar'></div><div id='TKBloader'>This Loading Effect is Powered By<a href="http://thekampoengblogger.blogspot.com">Blogger</a></div></div>

 Step 5

Klik Save Template

Catatan !
  • Ganti URL Gambar Loading di Sini dengan URL Gambar anda sendiri (dalam format GIF)
  • Anda dapat mengganti warna background #FDFEF8 dengan kode warna yang lain (lihat kode warna RGB dan HEX)
  • Anda juga dapat mengganti warna progress bar dengan warna lain, dengan cara mengganti kode warna #de1301 dengan kode warna yang lain. 

Berikut adalah URL Gambar loading yang bisa anda pilih

Merah




http://3.bp.blogspot.com/-vd1FeVCm7-o/UUV_xCzQNzI/AAAAAAAABX4/WjykjvCKPoY/s1600/TKB-Loading-1.gif
http://1.bp.blogspot.com/-VFI8K06DykY/UUWARlGw6oI/AAAAAAAABYI/TdLK8YvSz2A/s1600/TKB-loading-2.gif

http://2.bp.blogspot.com/-P4iKcPU-GUE/UUWApgtbJyI/AAAAAAAABYQ/Sg3RQRpmTf0/s1600/TKB-Loading-3.gif

Biru

 http://1.bp.blogspot.com/-PD3anyW494Q/UUWBhcMRL1I/AAAAAAAABYY/uIPX5eFg2dc/s1600/TKB-Loading-Blue-1.gif
http://2.bp.blogspot.com/-R_Rmq6XKKLY/UUWCXb43xHI/AAAAAAAABYg/bgUKykgRIIw/s1600/TKB-Loading-Blue-4.gif

http://4.bp.blogspot.com/-a4rE2T0lt9I/UUWCieakVUI/AAAAAAAABYo/rR2ym8NB7_I/s1600/TKB-Loading-Blue-5.gif

 Hijau

 

http://4.bp.blogspot.com/-Pm8jJpD9iYQ/UUWDRjlVKgI/AAAAAAAABYw/rsqulih4CKw/s1600/TKB-Loading-Green-1.gif

http://2.bp.blogspot.com/-S4qAlvhVJ3w/UUWDl5W64AI/AAAAAAAABY4/Poto6gMDrMA/s1600/TKB-Loading-Green-2.gif

Lainnya

 

  http://1.bp.blogspot.com/-JEdhhH-abAM/UUWEkW3sQVI/AAAAAAAABZE/yxOekBw7Rok/s1600/TKB-Loading-other.gif

http://2.bp.blogspot.com/-UqG46a9kSw4/UUWEkRQc_tI/AAAAAAAABZQ/AH-b-bTAAsQ/s1600/TKB-Loading-other2.gif


http://2.bp.blogspot.com/-nwlgx-by6Pc/UUWElOGTdzI/AAAAAAAABZY/IygFd-TxSOA/s1600/TKB-Loading-other3.gif
http://4.bp.blogspot.com/-H6G9KMp7Mv8/UUWEli_2v8I/AAAAAAAABZg/ki6-eqgSp6Y/s1600/TKB-Loading-other4.gif

Semoga bermanfaat.
Wassalam.

Membuat Efek Keyboard Pada Tulisan di Artikel Blog

Bila anda memiliki blog yang berisi tentang tutorial komputer, saat anda ingin menginstruksikan mengenai tombol keyboard tertentu, anda mungkin hanya akan menuliskannya dalam bentuk teks di blog anda, sehingga seringkali, anda harus menambahkan keterangan "tombol pada keyboard anda" pada instruksi tersebut. Nah, untuk itu, saya ingin memberikan tips dan trik untuk anda, dan tentunya anda pasti akan tertarik dengan yang satu ini, membuat efek keyboard pada tulisan di artikel blog.

Efek Keyboard pada tulisan di artikel blog


Efek keyboard ini bisa anda gunakan dalam artikel di blog anda, dan anda akan menemukan blog anda menjadi satu hal yang sangat menarik untuk di baca. Anda tidak percaya? coba saja anda memasangnya dan mengikuti langkah-langkah membuat efek keyboard pada tulisan di artikel blog.

Cara Memasangnya di Blog

Sebelum anda melakukan perubahan pada halaman HTML Template anda sebaiknya anda mem-backup template anda terlebih dahulu.

Step 1

Masuk ke halaman dashboard > Template > HTML

Step 2

Letakkan kode berikut tepat di atas ]]></b:skin>
kb{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;border:1px solid gray;padding:1px 5px;margin:0 5px;font-family:courier new;font-size:1.2em;-webkit-box-shadow:1px 0 1px 0 #fff, 0 2px 0 2px lightGray, 0 2px 0 3px #333;-moz-box-shadow:1px 0 1px 0 #fff, 0 2px 0 2px lightGray, 0 2px 0 3px #333;box-shadow:1px 0 1px 0 #fff, 0 2px 0 2px lightGray, 0 2px 0 3px #333;background:-moz-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:-webkit-gradient(linear, left top, right top, color-stop(0%, #ffffff), color-stop(25%, #e2e2e2));background:-webkit-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:-o-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:-ms-linear-gradient(left, #fff 0%, #e2e2e2 25%);background:linear-gradient(left, #fff 0%, #e2e2e2 25%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2e2e2', GradientType=1 )}kb.space{padding:0 90px}kb:hover{cursor:default} 

 Step 3

Klik Save Template

Cara Menggunakannya di Artikel Blog

Bila anda ingin menggunakannya di artikel anda, maka anda dapat menggunakan kode berikut :
<kb> Teks anda di sini </kb>
Ganti kata yang diberi warna merah dengan kata yang anda inginkan. Lihat demonya di bawah ini.

 
Semoga bermanfaat.
Wassalam.

Cara Memasang Kotak Find Us on Facebook (Facebook Like Box) di Blog

Sebagai rival dari twitter, facebook telah menjadi sosial media yang kian hari kian trend di kalangan muda mudi di seluruh dunia. Selain sebagai ajang silaturrahmi ke sesama teman di berbagai belahan dunia, facebook juga bisa digunakan sebagai sarana untuk berbagi artikel dan informasi ke sesama pengguna facebook. Bila postingan sebelumnya kita telah membahas tentang memasang twitter di blog (baca lagi 10+ tombol follow me twitter unik dan gratis untuk blog anda), kali ini kita akan membahas tentang Cara Memasang Kotak Find Us on Facebook (Facebook Box) di Blog. 


Cara Memasang Kotak Find Us on Facebook (Facebook Box) di Blog

Step 1

Masuk ke situs Like Box-Facebook Developer https://developers.facebook.com/docs/reference/plugins/like-box/

Step 2

Isi URL Facebook anda di dalam kolom Facebook Page URL. Silahkan memodifikasi tampilannya dengan mengubah pengaturan yang ada (lebar, tinggi, dan lain sebagainya)

Step 3

Klik Get Code > IFRAME > Copy kode yang diberikan

Step 4

Masuk ke halaman dashboard > Layout > Add gadget >  HTML/JavaScript

Step 5

Letakkan kode tadi ke dalam halaman HTML/JavaScript

Step 6

Klik Save

Tampilan facebook like-box anda akan seperti ini.

Facebook like-box


Semoga bermanfaat.
Wassalam. 

10+ Tombol Follow Me Twitter Unik dan Gratis Untuk Blog Anda

Twitter sudah menjadi salah satu sosial media yang sedang naik daun saat ini. Yang muda yang tua hampir semuanya sudah mengenal apa itu twitter. Dengan menggunakan sosial media twitter ini anda dapat menyebarkan pesan pendek sejumlah maksimal 200 kata dalam satu klik saja! Benar-benar menakjubkan bukan. Bila dibandingkan dengan telegraph atau surat yang digunakan pada zaman dahulu untuk mengirim pesan ke teman yang jauh, aplikasi twitter ini menjadi satu hal yang mungkin sulit dibayangkan oleh orang di zaman dahulu.

Di blog sendiri, aplikasi twitter ini tentunya sangat membantu dalam menyebarkan artikel-artikel di blog. Anda tentu saja menjadi sangat terbantu dalam menyebarkan artikel anda kepada khalayak ramai dengan cepat dan gratis. Anda pun dapat memberikan update artikel gratis anda lewat twitter dengan menggunakan fitur follow dari twitter sehingga pengunjung anda yang juga pengguna twitter dapat selalu update dengan artikel-artikel di blog anda. Selain itu dengan adanya fitur retweet pengunjung anda juga bisa menyebarkannya kembali ke teman-temannya yang lain sehingga akan membuat pengunjung yang penasaran dengan artikel anda datang dan berkunjung ke blog anda.

Anda tentunya tertarik untuk memasangnya bukan? Bila anda masih belum memiliki akun twitter, saya menyarankannya untuk membuatnya. Nah bila anda sudah memiliki akun twitter, bersiaplah untuk mulai memilih 10+ tombol follow me twitter unik dan gratis untuk blog anda!


twitter


Cara Memasang Tombol Follow Me Twitter di Blog

 Step 1

Masuk ke halaman dashboard > Layout > Add Gadget > HTML/JavaScript

Step 2

Letakkan kode tombol twitter yang anda pilih dan letakkan di halaman HTML/JavaScript

Step 3

Klik Save

50+ Tombol Follow Up Twitter Unik dan Gratis




























Catatan !
Ganti kata "twitterandadisini" pada kode dengan username twitter anda.

Selamat mencoba!
Wassalam.