Cara Pasang Widget Flag Counter di Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik dan panduan tentang Cara Pasang Widget Flag Counter pada Blog.

Fasilitas ini dapat membantu kita untuk mengetahui berapa banyak jumlah pengunjung serta asal negaranya yang mampir ke blog kita dan dapat juga menjadi sebuah parameter perkembangan buat suatu blog, Tapi ingat pengunjung yang datang untuk kedua kalinya tidak dihitung. Flag counter ini mendeteksi dari mana mereka berasal?,  yang dideteck oleh Flag Counter ini hanya IP Adress.  

Cara Pasang Widget Flag Counter pada Blogspot :

• Kunjungi dulu alamatnya http://flagcounter.com 

• Pada create your free counter isikan option-option untuk mengatur tampilan flag counter isikan option-option untuk mengatur tampilan flag counter dan sesuaikan dengan kondisi blog sobat :  

1. Maximum flag to show : jumlah bendara yang akan ditampilkan
2. Columns of flag : jumlah kolom bendera
3. Label on top of counter : nama dari counter flag
4. Background color : warna latar dari counter flag
5. Text color : warna tulisan
6. Border color : warna garis tepi dari counter flag
7. Show country flag : untuk menampilkan kode negara
8. Show pageview : untuk menampilkan jumlah halaman yang dikunjungi

• Setelah mengatur tampilan  flag counter, akan terlihat preview pada example flag counter with your choices setelah tampilan sesuai dengan keinginan kita kemudian klik get your flag counter
• Setelah itu copy code yang berada di Code for website Untuk di pastekan ke dashbor blog sobat
• Login ke blog >> tata letak atau layout >> Elemen halaman atau Page element.>> tambah Gadget atau add Gadget, >> pilih  opsi HTML/JAVA SCRIPTS setelah itu paste kode HTML Flag Counter yang anda dapatkan tadi. 
• Klik OK dan Save. 
• Atur Letaknya sesuai keinginan

Demikian blogger tutorial mengenai Cara Pasang Widget Flag Counter di Blog.

Semoga bermanfaat dan semoga berhasil.

Terima Kasih ^_^ 

Read More

Cara Membuat Efek Hover/Transparansi Pada Gambar dalam Postingan Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik dan panduan tentang Cara Membuat Efek Hover/Transparansi Pada Gambar dalam Postingan Blogspot.

Fungsi dari Tutorial ini adalah jika cursor mouse menyorot / atau berada pada salah Satu gambar pada blog, maka gambar tersebut akan menyala / buram pada tampilan blog pada postingan. 

Coba arahkan kursor / mouse pada gambar maka akan terlihat buram.

Diatas adalah contohnya.

Cara Membuat Efek Hover/Transparansi Pada Gambar dalam Postingan Blogspot :

• Pilih gambar yang akan digunakan 
• Setelah itu upload ke internet
• Setelah di-upload, Anda akan mendapatkan URL gambar tersebut 
• URL gambar tersebut harus Anda sisipi dengan kode berikut ini :

onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=40"
onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" style="opacity:1;filter:alpha(opacity=100)"

•  Berikut adalah contoh code untuk dipasang pada postingan, warna merah adalah URL gambar.

<img onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=40"
onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" style="opacity:1;filter:alpha(opacity=100)" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIDbWCHMH-7W9AtSmewtSS7bHrXDrL-stG5PaN2aZ44YhJo8LxRfvwmD-LsdwdZaUrQjUgcnmhFChhcaDE0Lso6YG0WIAVcUCuBx9Sx-YuPN54hSQPLIoXJvrWIxrYVaooKRWl8CKga9D1/s400/home.png"/></a>

Demikian blogger tutorial mengenai Cara Membuat Efek Hover/Transparansi Pada Gambar dalam Postingan Blog.

Semoga bermanfaat dan semoga berhasil.

Terima Kasih ^_^

Read More

Cara Menghilangkan Tulisan Diposkan Oleh Pada Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik dan panduan tentang Cara Menghilangkan Tulisan Diposkan Oleh Pada Blog.

Pengguna Blogger / Blogspot pasti sering melihat tulisan "Diposkan Oleh". Biasanya letaknya berada di bawah postingan Blog.

Cara Menghilangkan Tulisan Diposkan Oleh Pada Blogspot :

• Login pada Blogger
• Masuk mode Rancangan, kemudian Edit HTML
• Centang Expand Widget Templates
• Cari kode berikut. ( tekan F3 untuk mempercepat pencarian kode )

<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

• Jika sudah ketemu, Hapus semua kode tadi
• Terakhir, Simpan Template

Demikian blogger tutorial mengenai Cara Menghilangkan Tulisan Diposkan Oleh Pada Blog.

Semoga bermanfaat dan semoga berhasil.
Terima Kasih ^_^

Read More

Cara Membuat Daftar Isi Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik dan panduan tentang Cara Membuat Daftar Isi Blogspot.

Cara Membuat Daftar Isi pada Blogspot :

• Login pada Blogger
• Masuk mode Posting, kemudian Entri Baru
• Copy-Paste-kan kode berikut

<script src="http://muhammadwali2011.googlecode.com/files/scrip%20daftar%20isi%20ali%20bloggers.js">
</script><script src="http://blogtutorials-01.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

• Ganti kode yang berwana merah dengan alamat blog Anda
• Jika sudah, Simpan

Keterangan :

1. Pada saat mengCopy-Paste kode harus dalam keadaan HTML, bukan Compose
2. Aturlah tanggal posting pada Post Option menjadi sedikit lama agar dia tidak tampil pada halaman awal Blog Anda

Demikian blogger tutorial mengenai Cara Membuat Daftar Isi Blogspot.

Semoga bermanfaat dan semoga berhasil.
Terima Kasih ^_^

Read More

Kategori Kalender Dataran

<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar004A.htm" width="120" height="150" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar00411.htm" width="120" height="150" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0042.htm" width="120" height="150" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>
<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0043.htm" width="125" height="150" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0044.htm" width="125" height="157" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0045.htm" width="125" height="150" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>

Read More

Kategori Kalender Abstrak

<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0013.htm" width="161" height="280" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0014.htm" width="170" height="290" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0015.htm" width="160" height="290" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://www.free-blog-content.com/">Blogger Tutorial</a></center></br>
<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0016.htm" width="166" height="312" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0017.htm" width="138" height="220" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0018.htm" width="174" height="248" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>
<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0019.htm" width="166" height="231" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>		<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0020.htm" width="130" height="205" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>

Read More

Kategori Kalender Alam

<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0035.htm" width="166" height="362" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0036.htm" width="166" height="240" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0037.htm" width="166" height="240" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>
<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0038.htm" width="166" height="262" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>		<!-- Blogger Tutorial --> <br><center><iframe src="Calendars/calendar0039.htm" width="166" height="226" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>

Read More

Kategori Kalender Binatang

<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0029.htm" width="162" height="329" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0030.htm" width="165" height="232" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0031.htm" width="166" height="239" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>
<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0032.htm" width="166" height="332" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0033.htm" width="166" height="366" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0034.htm" width="166" height="283" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>

Read More

Kategori Kalender Mobil

<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar00061.htm" width="162" height="228" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0007.htm" width="170" height="228" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar00081.htm" width="160" height="222" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>
<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0009.htm" width="162" height="225" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0010.htm" width="162" height="228" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar00111.htm" width="182" height="204" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>
	<!-- Blogger Tutorial --> <br><center><iframe src="http://www.free-blog-content.com/Calendars/calendar0012.htm" width="162" height="182" marginwidth="0" marginheight="0" frameborder="no" scrolling=no allowtransparency="true"></iframe></center> <center><a style="font-size: 3mm" href="http://blogtutorials-01.blogspot.com/">Blogger Tutorial</a></center></br>

Read More

Cara Mengganti Bentuk Cursor menjadi Cursor Animasi pada Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik panduan tentang  Cara Mengganti Bentuk Cursor menjadi Cursor Animasi pada Blogspot.

Jika biasanya cursor hanya berbentuk icon tanda panah, mau tau cara mengganti cursor pada blog.

Cara Mengganti Bentuk Cursor menjadi Cursor Animasi pada Blogspot :

• Login pada Blogger
• Masuk mode Rancangan, kemudian Edit HTML
• Centang Expand Widget Template
• Cari kode ]]></b:skin>
• Jika sudah ketemu, letakan kode berikut diatas kode tadi

/* CURSOR CCS GENERATOR - BLOGTUTORIALS-01.BLOGSPOT.COM */

body { cursor:url("http://myspace-html-layout.com/cursors/black_skull.cur"),default;}

• Anda bisa mengganti jenis kursornya dengan mengganti kode http://myspace-html-layout.com/cursors/black_skull.cur . dengan kode dibawah ini. ( kodenya berada dibawah gambar )

http://cursor.com/images/11a.gif

http://cursor.com/images/10a.gif

 

http://cursor.com/images/12a.gif

http://cursor.com/images/19a.gif

http://cursor.com/images/20a.gif

 

http://cursor.com/images/24a.gif

 

http://cursor.com/images/33a.gif

 

http://cursor.com/images/40a.gif

 

http://cursor.com/images/85a.gif

 

http://cursor.com/index_07.gif

Jika tidak ada yang cocok dengan Anda, Anda bisa mencari yang lainnya Disini

• Jika sudah, Simapn Template

Demikian blogger tutorial mengenai Cara Mengganti Bentuk Cursor menjadi Cursor Animasi pada Blog. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More

Cara Membuat Widget Perkiraan Cuaca Di Kota-kota Besar di Dunia

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik panduan tentang  Cara Membuat Widget Perkiraan Cuaca Di Kota-kota Besar di Dunia.

• Untuk memasang widget ini kunjungi situs http://www.weatherforecastmap.com/indonesia/jakarta/getwidget.phtml
• Pilih kota Anda dan pilih tampilan sesuai dengan keinginan Anda
• Lalu Copy kodenya

 

• Selanjutnya Login pada Blogger
• Masuk mode Rancangan, pada Elemen Laman
• Pilih Tambah Gadget, lalu pilih HTML/JavaScript
• Paste-kan kode yang tadi di Copy
• Jika sudah, Simpan

Demikian blogger tutorial mengenai Cara Membuat Widget Perkiraan Cuaca Di Kota-kota Besar di Dunia. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More

Cara Memasang RadarUrl pada Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik panduan tentang  Cara Memasang RadarUrl pada Blog.

Contoh RadarUrl :

Cara Memasang RadarUrl pada Blogspot :

• Login pada Blogger
• Masuk mode Rancangan, pada Elemen Laman
• Pilih Tambah Gadget, lalu pilih HTML/JavaScript
• Masukan kode berikut

<script type="text/javascript" src="http://radarurl.com/js/radarurl_widget.js"></script><script type="text/javascript">radarurl_call_radar_widgetv2({edition:"Dynamic",location:"lefttop"})</script><noscript><a href="http://radarurl.com/">RadarURL</a></noscript>

• Jika sudah, Simpan

Keterangan :

Jika Anda ingin menyunting sendiri tampilannya silahkan ikuti langkah-langkahnya seperti berikut.

• Silahkan masuk ke http://radarurl.com/ 
• Lalu pilih disebelah mana Widget RadarUrlnya akan di letakan
• Jika sudah sesuai, Copy script yang diberikan
• Kemudian Masuk mode Rancangan, kemudian Edit HTML
• Centang Expand Widget Teplates
• Cari kode </body> ( untuk mempercepat pencarian kode tekan F3, lalu copy kode yang akan dicari dikotak yang muncul )
• Jika sudah ketemu, letakan paste-kan kode yang tadi di atas kode </body>
• Jika sudah, Simpan

Demikian blogger tutorial mengenai Cara Memasang RadarUrl pada Blog. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^ 

Read More

Cara membuat Chat Yahoo Messenger di Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik panduan tentang  Cara membuat Chat Yahoo Messenger di  Blog.

Blog atau social network adalah sarana untuk menyampaikan atau berbagi pandangan, pemikiran, ide, curhat, menyelenggarakan bisnis online dan lain-lain. Pada intinya, melalui blog dan social network, kita ingin berinteraksi langsung dengan teman, calon teman, rekan bisnis, pelanggan, prospek dan semua orang yang sengaja atau tidak sengaja berkunjung ke blog atau profil kita. Oleh karena itu blog atau social network menyediakan berbagai sarana untuk berinteraksi dengan visitor. Yang paling utama adalah adanya kotak komentar. Ini yang membedakan antara blog dengan website konvensional.
Pasang chat ym pingbox Cara Pasang YM Chat Pingbox di Blog

Untuk mempermudah interaksi antara visitor dan penulis blog atau pemilik profil social network, misalnya Friendster, Yahoo Messenger menyediakan fasilitas untuk menghubungkan blog atau profil friendster dengan chat cliet YM sehingga visitor bisa berinteraksi langsung secara pribadi dengan penulis blog atau pemilik profil.

Sebelumnya, YM menyediakan fasilitas untuk menampilkan status YM pemilik, namun sepertinya hal itu kurang optimal karena kita tetap harus membuka chat client YM dan login menggunakan ID kita, sehingga kadang visitor segan untuk memanfaatkan fasilitas ini.

Sekarang Yahoo Messenger menyediakan fasilitas baru lagi yaitu menampilkan chat box di profil friendster atau di halaman blog secara langsung. Jadi apabila kita sedang online, pengunjung yang ingin mengontak kita secara langsung tidak perlu repot lagi membuka chat client, tapi langsung menuliskan pesannya di kotak chat tersebut

Cara membuat Chat Yahoo Messenger di  Blogspot :

• Buka halaman http://messenger.yahoo.com/pingbox/ 
• Jika anda belum login, login terlebih dahulu menggunakan ID Yahoo anda.
• Klik “Create a Pingbox”
• Isilah kolom yang tersedia, misalnya: background, nama yang akan ditampilkan, ukuran huruf, Pesan yang ditampilkan jika anda sedang online, pesan jika anda offline.
• Klik Next 
• Pilih website dimana anda akan meletakkan YM chat box tersebut.Any website untuk semua jenis website (termasuk blog wordpress), My Space, Friendster, Hi5, Blogger, Live Spaces, Live Journal, dan Xanga. Untuk Facebook akan kita bahas di artikel yang lain.
• Tentukan ukuran chatbox yang akan digunakan atau gunakan ukuran yang direkomendasikan.
• Setelah itu, klik “Copy To Clipboard”
• Lalu Paste kode tersebut di tempat yang anda inginkan, misalnya di sidebar untuk blogspot (blogger)
• Jika sudah, Simpan

Demikian blogger tutorial mengenai Cara membuat Chat Yahoo Messenger di  Blog. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More

Cara Membuat Tulisan Seperti sedang di Ketik

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik tentang Cara Membuat Tulisan Seperti sedang di Ketik.

Maksudnya adalah text yang di tulis seakan-akan seperti sedang di ketik 

Contohnya seperti ini :

Mau seperti tulisan di atas..? Ini scriptnya :

<script language="JavaScript">
var text="*...:::http://blogtutorials-01.blogspot.com:::...*";
var delay=10;
var currentChar=1;
var destination="[none]";
function type()
{
//if (document.all)
{
var dest=document.getElementById(destination);
if (dest)// && dest.innerHTML)
{
dest.innerHTML=text.substr(0, currentChar)+"<blink>_</blink>";
currentChar++;
if (currentChar>text.length)
{
currentChar=1;
setTimeout("type()", 5000);
}
else
{
setTimeout("type()", delay);
}
}
}
}
function startTyping(textParam, delayParam, destinationParam)
{
text=textParam;
delay=delayParam;
currentChar=1;
destination=destinationParam;
type();
}
</script>
<b><div id="textDestination" style="background-color: #ffffff; style=" font: 10px arial; color: #ff0000; margin: 0px;"></div></b>


<script language="JavaScript">
javascript:startTyping(text, 50, "textDestination");

</script>

Demikian blogger tutorial mengenai Cara Membuat Tulisan Seperti sedang di Ketik. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More

Berkomentar di Blog Lain Dapat Backlink Untuk Optimasi SEO

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan tips tentang Berkomentar di Blog Lain Dapat Backlink Untuk Optimasi SEO.

Apa itu BACKLINK pada Komentar?

Backlink merupakan link yang menuju ke-BLOG milik kita yang terdapat pada blog dimana tempat kita memberikan komentar, jadi dengan memberikan komentar maka dengan cara tidak langsung kita telah memberikan link balik menuju ke BLOG kita sendiri, ini merupakan keuntungan yang kita dapatkan selain dapat menaikkan jumlah pengunjung kita juga akan dapat menaikkan RANK kita. Karena apa?? setelah beberapa jam setelah kita berkomentar maka GOOGLE akan Meng-Indeks komentar anda di blog mereka, asalkan komentar yang anda berika bukan sebuah SPAM, apabila terdeteksi sebagai SPAM maka tidak akan di indeks oleh google maka dari itu jika memberikan komentar sebaiknya jangan memberikan komentar SPAM karena dapat merugikan kita,"eh sudah cape'-cape' koment tapi ga' dapet BACKLINK". Pastinya anda akan kecewa.

Jadi Sebaiknya kita saling memberikan komentar karena apa.. anda tidak rugi bila memberikan komentar kepada blogger lainya (kita akan mendapatkan BACKLINK dan menaikkan page kita di google jadi termasuk kedalam SEO "Search Engine Optimization") serta dapat menaikkan jumlah GOOGLE ADSENSE kita juga lho.

Demikian blogger tips mengenai Berkomentar di Blog Lain Dapat Backlink Untuk Optimasi SEO. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More

Cara Mempercantik Blog agar menjadi Bagus dan Berkualitas

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik tentang Cara Mempercantik Blog agar menjadi Bagus dan Berkualitas.

Blog saat ini sudah menjadi bagian dari gaya hidup masyarakat Indonesia. setiap tahunnya, blogger indonesia meningkat dan terus meningkat. tak heran, beberapa blogger memiliki lebih dari satu blog. dibandingkan dengan situs jejaring seperti facebook, mungkin blog kalah popularitasnya. namun, menurut saya, setiap apapun itu memiliki kelebihan dan kekurangan. dengan blog, kita bisa mempercantik blog atau mengotak-atiknya sedemikian rupa atau bisa menjadi teman curhat bahkan bisa menjadi sumber penghasilan. sekali lagi segala sesuatu memiliki kelbihan dan kekurangan.

Membuat blog menjadi bagus atau baik itu sangat penting namun akan lebih baik lagi jika blog itu berkualitas. salah satu caranya adalah mempercantik blog. mempercantik sesuatu berarti kita harus merawat dan menjaganya. kita bisa merawat  blog dengan menyuguhkan informasi-informasi yang berisi dan berkualitas. kualitas sebuah blog dapat dinilai oleh pengunjung blog. semakin baik suatu blog, semakin banya pengunjung yang datang.

Tips dan trik mempercantik blog salah satunya adalah dengan memasanag custom template pada blog. kita sebaiknya memperhatikan template blog kita. hal ini sangat penting karena template akan berdampak pada keindahan tampilan blog kita. banyak tips dan trik mempercantik blog yang bisa kita dapatkan. namun, dalam mempercantik suatu blog janganlah berlebihan, karena sesuatu yang berlebihan itu tidak baik. buang widget-widget yang tidak berguna karena widget yang seperti itu justru akan memberatkan blog kita untuk di akses oleh pengunjung. pilih template yang cocok untuk blog kalian.

Blog cantik itu baik dan berkualitas. bagus dari tampilannya dan berkualitas dari isi blognya. sudahkah teman-teman memiliki blog yang cantik?

Demikian blogger tips mengenai Cara Mempercantik Blog agar menjadi Bagus dan Berkualitas. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More

Cara Pasang Chat Box Facebook di Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik panduan tentang Cara Pasang Chat Box Facebook di Blog.

Cara Pasang Chat Box Facebook di Blogspot :

• Login pada Blogger
• Masuk mode Rancangan, pada Elemen Laman
• Pilih Tambah Gadget, kemudian pilih HTML/JavaScript
• Masukan kode berikut

<div id=”fb-root”></div>

<script src=”http://connect.facebook.net/en_US/all.js#

appId=YOUR_APP_ID&amp;xfbml=1″></script>

<fb:login-button show-faces=”true” width=”200″ max-rows=”1″

perms=”user_likes, friends_likes”></fb:login-button> 

• Jika sudah, Simpan

Demikian blogger tutorial mengenai Cara Pasang Chat Box Facebook di Blog. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

 

Read More

Cara Bikin Efek Rusak pada Browser pada saat Masuk Blog

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik tentang Cara Bikin Efek Rusak pada Browser pada saat Masuk Blog.

Cara Bikin Efek Rusak pada Browser pada saat Masuk Blogspot :

• Login pada Blogger
• Masuk mode Rancangan, kemudian Edit HTML
• Klik Download Template Lengkap untuk membackup template
• Cari kode <head>
• Letakan kode berikut dibawah kode tadi

Karena kode yang sangat panjang silahkan klik Disini untuk mendownload kodenya.

• Jika sudah, Simpan Template

Demikian blogger tutorial mengenai Cara Bikin Efek Rusak pada Browser pada saat Masuk Blog. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More

Cara Membuat Breadcrumb Navigation sebagai Pengganti Label

By. Dedi Yahya S

Pada kesempatan kali ini saya akan memberikan trik tentang Cara Membuat Breadcrumb Navigation sebagai Pengganti Label.

Cara Membuat Breadcrumb Navigation sebagai Pengganti Label pada Blogspot :

• Login pada Blogger
• Masuk mode Rancangan, kemudian Edit HTML
• Centang Expand Widget Templates
• Klik Download Template Lengkap untuk mengbackup.
• Cari kode ]]></b:skin>
• Letakan kode berikut sebelum kode tadi

.breadcrumbs { padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:95%; line-height: 1.4em; border-bottom:3px double #e6e4e3;

• Selanjutnya cari kode

<b:include data='top' name='status-message'/>

• Ganti kode tadi dengan kode berikut

<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/>

• Selanjutnya cari lagi kode

<b:includable id='main' var='top'>

• Ganti kode tadi dengan kode Optimized HTML berikut

<b:includable id='breadcrumb' var='posts'> <b:if cond='data:blog.homepageUrl == data:blog.url'> <!-- No breadcrumb on home page--> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <p class='breadcrumbs'> <span class='post-labels'>Results found at &gt; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> <b:loop values='data:posts' var='post'> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'>&gt; <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast == &quot;true&quot;'>&gt; </b:if> </b:loop> <b:else/> &gt; </b:if> <span><data:post.title/></span> </b:loop> </span> </p> <b:else/> <b:if cond='data:blog.pageType == &quot;archive&quot;'> <!-- breadcrumb for the label archive and search pages - blogspot seo friendly breadcrumbs by http://www.uc1n.com--> --><p class='breadcrumbs'> <span class='post-labels'> <a expr:href='data:blog.homepageUrl'>Home</a> &gt; Archives for <data:blog.pageName/> </span> </p> <b:else/> <b:if cond='data:blog.pageType == &quot;index&quot;'> <p class='breadcrumbs'> <span class='post-labels'> <b:if cond='data:blog.pageName == &quot;&quot;'> <a expr:href='data:blog.homepageUrl'>Home</a> &gt; All posts <b:else/> <a expr:href='data:blog.homepageUrl'>Home</a> Posts filed under &gt;<data:blog.pageName/> </b:if> </span> </p> </b:if> </b:if> </b:if> </b:if> </b:includable> <b:includable id='main' var='top'>

• Jika sudah, Simpan
  

Tambahan :

Jika ingin judul posting di akhiri breadcrumb Anda memuat link seperti di blog ini, silahkan ganti kode

<span><data:post.title/></span>

Dengan kode berikut

<b:if cond='data:post.url'> <a expr:href='data:post.url'><span><data:post.title/></span></a></b:if>

Silahkan Simpan Template dan selesai

Demikian blogger tutorial mengenai Cara Membuat Breadcrumb Navigation sebagai Pengganti Label. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

Read More