rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px; background: #000 -color: #fff;-moz-border-radius:5px; margin:5px;} .rbbox:hover{background: #000 -color: #fffrgb(255, 255, 255);}

Panduan Blogspot


Panduan Blogspot


Berikut ini adalah Tutorial Blogspot dari saya.Silahkan di baca ya Tutorial Blogspot nya.
Semoga Panduan Blogspot dapat bermanfaat untuk sobat semua. 


1. Panduan Membuat Blog Di Blogspot




Panduan Membuat Blog Di Blogspot


Dalam panduan blogspot kali ini saya akan menulis artikel cara membuat blog di blogspot.Blogspot merupakan salah satu penyedia layanan  blog gratis yang sangat populer.Blogspot adalah layanan blog gratis yang di berikan oleh google.Dimana ketika mendaftar kita mendaftarnya di di www.blogger.com,tetapi kita memakai sub domain blogspot.Misalnya namadomainsobat.blogspot.com.

Banyak sekali kelebihan blogspot di banding penyedia layanan blog gratis lainnya.Beberapa contoh kelebihannya adalah pengoperasiannya yang sangat mudah di mengerti sehingga cocok bagi pemula,kita dapat mengedit dan merubah template blog kita sesuai dengan keinginan kita.

Cara membuat blog di blogspot juga cukup mudah.Hal yang harus kita sediakan hanyalah email gmail.Kenapa harus email gmail mas?.Karena blogspot adalah salah satu layanan yang di berikan oleh google,jadi bila kita ingin membuat blog di blogspot maka kita harus memakai email dari gmail.Bila teman-teman belum mempunyai akun di gmail,silahkan buat akun di gmail terlebih dahulu.Bila belum tahu cara membuat email di gmail,silahkan baca di sini Cara Membuat Email Di Gmail.com

Bila teman-teman sekalian sudah memiliki akun di gmail.ayo kita segera membuat blog di blogspot.Ikuti langkah-langkah berikut ini :

1.Silahkan kunjungi situs www.blogger.com
2.Bila halaman blogger sudah terbuka,perhatikan bagian halaman bagian kiri sobat.Silahkan sobat login dengan akun gmail sobat di kolom yang telah di sediakan.Perhatikan gambar di bawah ini :
3.Setelah sobat login dengan akun gmail sobat,maka sobat akan di bawa ke halaman pendaftaran blogger.Isikan formulir yang telah di sediakan.Setelah itu klik LANJUTKAN.Lihat gambar di bawah :
 4.Setelah sobat masuk ke halaman Dasbor,klik Ciptakan Blog Anda.Lihat gambar di bawah
5.Kemudian isilah judul dan alamat blog sobat.Dalam mengisi alamat blog,sobat harus benar-benar serius karena sifat alamat blog adalah permanen.Jangan lupa cek ketersediaan alamat blog sobat.Setelah judul dan alamat blog telah di isi klik LANJUTKAN.
 6.Pilih template yang sobat inginkan.setelah itu kli LANJUTKAN
 7.Selamat,blog sobat sudah jadi.Bila sobat langsung ingin membuat posting klik Mulai Blogging
 Pada tahap ini blog sobat sudah jadi.Untuk pembahasan bagaimana cara-cara blogging di blogger/blogspot,akan saya bahas dalam panduan blogspot selanjutnya.Semoga artikel saya ini bermanfaat.




2. Cara Membuat Posting Di Blog



Cara Membuat Posting Di Blogspot

Dalam panduan blogspot kali ini saya akan membahas cara membuat postingan di blogspot.Mungkin di antara teman-teman ada yang belum tahu atau kesulitan dalam membuat postingan di blogspot.Posting adalah tulisan-tulisan yang berada di dalam sebuah blog.Contoh posting adalah tulisan saya ini yang sedang sobat baca.Jadi apakah sobat sudah mengerti apa yang dimaksud dengan posting.Jika sudah mengerti,Ayo kita mulai membuat posting.

Untuk membuat posting di blogspot,Ikuti langkah-langkah berikut ini :

1.Login ke akun blogger sobat
2.KlikEntri Baru
3.Setelah itu isilah judul postingan sobat di kolom judul.
   dan tulis postingan yang sobat ingin publikasikan di dalam kolom yang besar
   Di Kolom label,isi dengan kategori yang sesuai dengan postingan sobat
   Lihat gambar di bawah :



4.Setelah sobat selesai menulis,klik Terbitkan Entri untuk menerbitkan/mempublikasikan postingan sobat.
5.Selesai

Akhirnya postingan sobat yang pertama di blog sobat sudah berhasil di publikasikan/di terbitkan.Untuk melihat hasil postingan sobat di blog sobat,klik Lihat Entri.
















Bagaimana hasilnya? Semoga artikel cara membuat postingan di blogspot dapat membantu sobat-sobat sekalian.Sampai jumpa di panduan blogspot selanjutnya


3. Cara Mengganti Dan Mendesain Template Di Blogspot



Cara Mengganti Dan Mendesain Template Di Blogspot

Panduan blogspot kali ini akan membahas cara mengganti dan mendesign template di blogspot.Template adalah desain-desain halaman blog /web beserta seluruh komponennya baik berupa file statis maupun file dinamis yang berupa program atau aplikasi yang berjalan sebagai aplikasi web/blog.Seperti yang sobat sekarang lihat di monitor,terlihat susunan gambar beserta tulisannya.Itu yang di namakan template.Bila masih belum paham,coba perhatikan baik-baik halaman yang sedang sobat baca ini.Ini adalah template blog saya.

 Dalam bahasan kali ini kita mengganti dan mendesain template yang telah di sediakan oleh blogger.
Okey tanpa panjang lebar lagi,mari kita mulai cara mengganti dan mendesain template di blogspot.Perhatikan baik-baik panduan berikut :

1.Login ke akun blogger sobat
2.Kenudian klik menu RANCANGAN
3.Setelah iitu klik Perancang Template
4.Akan tampil halaman seperti gambar di bawah ini
Di menu inilah kita bisa mendesain template blog kita.Perhatikan menu pilihan di sebelah kiri sobat.Di situ ada pilihan menu template,background,adjust widths,layot dan advanced.

*Template.Di menu ini kita bisa memilih template yang kita sukai
*Background.Di menu ini kita bisa merubah background/latar belakang template blog kita.Kita juga bisa memasukan gambar sendiri untuk menjadi latar belakang template blog kita.
*Adjust Widths.Dalam menu ini kita bisa mengatur lebar latar entri/latar posting dan lebar latar gadget blog kita.
*Layout.Di menu ini kita bisa mmemilih tampilan layout yang sobat sukai sukai.
*Advanced.Ini adalah menu ke sukaan saya.Di menu ini kita bisa mengatur warna latar belakang,warna tab menu,warna judul posting,warna latar gadget,dan masih banyak lagi.Silahkan sobat bereksperimen sendiri sesuai keinginan sobat.

Jika sudah selesai mengedit template,jangan lupa klik tombol Apply to Blog.
 Selamat akhirnya template blog karya sobat sendiri telah selesai.Semoga dengan template yang baru ini sobat bisa blogging dengan semangat yang tinggi.Semoga artikel saya ini dapat bermanfaat untuk sobat sekalian.Bila ada pertanyaan atau saran,silahkan tulis komentar sobat di bawah.Sampai jumpa di Panduan Blogspot selanjutnya.



4. Cara Membuat Read More Di Postingan Blog



Cara Membuat Read More Di Postingan Blog


Dalam panduan blogspot kali ini,kita akan membahas cara membuat read more di postingan blog.Mungkin ada beberapa teman-teman yang belum tahu apa itu read more.Coba perhatikan halaman beranda blog ini,di setiap postingan saya ada link Baca Selengkapnya.Itulah yang di sebut dengan read more.Read more ini sangat berguna bila postingan sobat sudah banyak.Tentu sobat ingin blog sobat kelihatan rapi dan menarik bukan?.Jadi cobalah tips ini.saya juga memakai read more di setiap postingan saya.Coba lihat gambar berikut


Itu adalah salah satu contoh postingan saya yang menggunakan read more.Okey langsung aja kita mulai membuatnya

*Silahkan sobat login ke akun Blogger sobat.
*Kemudian klik entri baru,sobat juga bisa mengedit postingan sobat yang sebelumnya.
*Di menu tool bar postingan terdapat banyak menu.Menu yang di gunakan untuk membuat read more adalah menu Insert Jump break.Letaknya berada di sebelah insert video.Lihat gambar berikut
*Bila sobat ingin menggunakannya di paragraf pertama,klik insert jump break tersebut setelah tulisan di paragraf pertama selesai.Sebaiknya gunakan read more di akhir tulisan paragraf pertama agar setiap postingan kelihatan lebih rapi.
*Setelah selesai membuat read more di postingan blog sobat.Coba lihat hasilnya di halaman beranda blog sobat.

Bagaimana hasilnya?.Semoga artikel saya ini bisa bermanfaat untuk sobat sekalian.Sampai jumpa dipanduan blogspot berikutnya.




5. Cara Upload Foto,Gambar Dan Video Di Dalam Postingan Blog


Cara Upload Foto,Gambar Dan Video Di Posting Blog


Panduan Blogspot kali ini akan membahas cara upload foto/gambar dan video di postingan blog.Agar artikel postingan kita lebih menarik untuk di lihat para pengunjung,tidak ada salahnya sobat sekalian menyisipkan foto,gambar dan video di setiap postingan artikel sobat.Bila sobat ingin menerangkan sesuatu di dalam postingan blog,tentu sobat perlu menyisipkan foto,gambar atau video,agar para pengunjung mengerti apa maksud dari postingan sobat.Bagi sobat blogger yang belum mengetahui cara upload foto,gambar dan viseo,silahkan ikuti panduan berikut :

*Login ke akun bogger sobat
*Klik Entri Baru
*Bila sobat ingin meng upload foto atau gambar di postingan,klik tool bar Insert Image.

Lalu Klik Pilih Berkas untuk memilih foto atau gambar yang sobat ingin masukan di dalam postingan.Setelah foto atau gambar yang sobat inginkan sudah ter upload,klik Add Selected untuk menyisipkannya ke dalam postingan sobat.Lihat gamabar di bawah
*Bila sobat ingin mengupload video ke dalam postingan Klik Insert a Video
 Kemudian klik Pilih video untuk diunggah,Dan klik Upload untuk menyisipkannya ke dalam postingan.Perhatikan gambar berikut

*Selesai

Sepertinya bahasan kita tentang cara upload foto,gambar dan video di posting blog,sudah selesai.Semoga artikel saya ini dapat berguna untuk sobat sekalian.Sampai jumpa di panduan blogspot berikutnya.




6. Cara Membuat Marquee/Tulisan Berjalan Di Blog


Cara Membuat Marquee/Tulisan Berjalan Di Blog


 Panduan Blogspot kali ini akan membahas cara membuat marquee/tulisan berjalan di blog.Marquee/tulisan bergerak ini sangat diminati para blogger,karena tampilannya yang dinamis dan sangat menarik untuk di lihat.Tetapi sobat jangan terlalu banyak memakai marquee di blog,ntar para pengunjung bingung karena tulisan di blog sobat pada berjalan,hehe,,,.Cara membuatnya juga cukup mudah,apa saja yang dibutuhkan untuk membuat marquee?.Langsung saja kita mulai bahasan cara membuat marquee/tulisan berjalan di blog.

Marquee ini bisa di buat dengan menggunakan tag <marque>.....</marque>
Atribut yang biasa di gunakan adalah :
DIRECTION="left,right,up,down"-->Mengatur arah gerakan teks

BGCOLOR="Warna"-->Untuk mengatur warna background (latar belakang) teks

BEHAVIOR="scroll,slide,alternate"-->untuk mengatur prilaku gerakan

scroll-->teks bergerak berputar
slide-->teks bergerak sekali lalu berhenti
alternate-->teks bergerak bolak-balik

SCROLLAMOUNT="angka"-->mengatur kecepatan dalam pixel,semakin besar angka semakin cepat gerakannya.

WIDTH="Lebar"-->mengatur lebar blok teks dalam pixel atau persen.

Biar lebih jelas,ayo kita lihat contoh di bawah ini :

Contoh marque dari gerakan

<marquee  align="center" direction="left"  height="200"  scrollmount="2"  width="40%">
marque dari kiri kekanan
</marquee>


marquee dari kiri kekanan

sobat bisa mengganti kata "left"sesuai dengan keingginan sobat dengan "right,up,down"

Contoh marque berdasarkan prilaku gerakan :

<marquee  align="center" direction="left"  height="200"  scrollmount="2"  width="70%" behavior="alternate">
marque bolak-balik
</marquee>


marquee bolak-balik

Contoh marquee dengan latar belakang
<div align="left">
<font face="georgia"  color="white"><b><marquee  bgcolor="Black" width="70%"  scrollamount="3"  behavior="alternate">
marque dengan latar belakang
</marquee></b></font></div>

marque dengan latar belakang

Contoh marquee yang di dalamnya terdapat link
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">
<a href="http://www.andreykusanagi.com/" target="new">Panduan Blogspot</a>


<a href="http://www.andreykusanagi.com/" target="new">Download Software Gratis </a>


<a href="http://www.andreykusanagi.com/" target="new">Blogger Keren </a>


</marquee>



Panduan Blogspot


Download Software Gratis 


Blogger Keren 

Sepertinya hanya itu saja contoh yang bisa saya berikan.Silahkan sobat otak-atik sendiri agar muncul variasi baru.Selamat bereksperimen.
Sampai jumpa di panduan blogspot berikutnya.




7. Cara Membuat Efek Refresh Di Blog



Cara Membuat Efek Refresh Di blog


Dalam panduan blogspot kali ini saya akan memberikan informasi tentang cara membuat efek refresh di blogspot.Fungsi refresh ini adalah untuk penyegaran kembali ke halaman utama blog sobat sekalian.Fungsi refresh ini sama dengan fungsi refresh yang ada di browser internet,perbedaannya adalah refresh ini bekerja secara otomatis,jadi para pengunjung tidak perlu menggunakan refresh yang ada di tool bar.Bagi sobat yang ingin membuatnya,ikuti langkah-langkah berikut ini.

*Login ke akun blogger sobat
*Lalu klik menu RANCANGAN
*Lalu pilih/klik Edit Html  
*Cari kode </head>,agar lebih mudah mencarinya klik Ctrl+F
*Masukan kode berikut tepat di atas kode </head>

<meta http-equiv="refresh"  content="30"/>

content="30"=>menunjukan proses refresh akan dilakukan dalam rentang waktu 30 detik.Sebaiknya angka ini di set jangan terlalu cepat karena para pengunjung akan kesal karena belum selesai baca postingan udah refresh.
*Klik SIMPAN TEMPLATE
*Selesai

Selain hal di atas,refresh ini juga mempunyai fungsi untuk redirect dari URL Addres satu ke URL Addres lainnya.Contoh,saya dulu punya blog dengan URL Addres blogkusanagi.blogspot.com.Tetapi saya tidak ingin menulis lagi di blog tersebut.Agar para pengunjung blog saya yang di blogkusanagi.blogspot.com tahu kalau saya sudah pindah alamat,jadi saya menggunakan refresh ini.Karena refresh ini akan secara otomatis membawa para pengunjung blog saya di blogkusanagi.blogspot.com ke blog saya yang sekarang.Coba sobat buka alamat URL blogkusanagi.blogspot.com.Pasti langsung akan di bawa ke alamat blog ini.Okey,bagi sobat yang ingin membuat refresh yang berfungsi untuk redirect.Silahkan ikuti langkah-langkah berikut

*Login ke akun blogger sobat
*Pilih/klik menu RANCANGAN
*Klik Edit HTML
*Masukan kode di bawah ini di atas kode </head>

<meta http-equiv="refresh"  content="0;URL=isi alamat URL yang sobat inginkan"/>

*Klik SIMPAN TEMPLATE
*Selesai

Semoga artikel saya tentang cara membuat efek refresh di blog dapat berguna untuk sobat sekalian.Sampai jumpa di panduan blogspot berikutnya. 




8. Cara Membuat Buku Tamu Di Blog


Cara Membuat Buku Tamu Di Blog


Dalam panduan blogspot kali ini,kita akan membahas cara membuat buku tamu di blog.Memasang buku tamu di blog merupakan hal yang lumayan penting,karena buku tamu ini salah satu sarana untuk berinteraksi antara pemilik blog dan para pengunjung.Dengan adanya buku tamu ini,para pengunjung bisa mengungkapkan isi hatinya tentang blog yang sobat buat,bisa berupa pujian,saran maupun kritik.Cara membuatnya juga tidak terlalu sulit.Ayo segera kita mulai cara membuat buku tamu di blog.Silahkan sobat ikuti langkah-langkah berikut ini :


 Kita akan membuat buku tamu dengan gratis,mau?" ayo kita mulai
*Buka alamat http://www.shoutmix.com
*Setelah masuk ke halaman utama shoutmix,Klik Create Shoutbox
*Setelah itu,Isi form yang telah disediakan.Lalu klik Continue 
*Jika sobat sudah terdaftar,silahkan sobat login dengan id sobat.
*Setelah masuk ke akun sobat,klik style&colors.Pada menu style&colors sobat bisa mengganti warna dan style shoutbox sesuai keinginan sobat.
*Setelah selesai,klik back to settings 
*Copy kode html shoutbox sobat

Sekarang kode shoutbox tersebut akan kita pasang di blog kita.
*Silahkan sobat login ke akun blogger sobat
*Klik RANCANGAN
*Lalu klik Tambah Gadget
*Lalu pilih/klik Html/Javascript
*Paste kan kode shoutbox sobat tadi di kotak yang disediakan,lalu klik SIMPAN.
 sobat juga bisa menentukan posisi buku tamu sesuai keinginan sobat.
*Selesai

Akhirnya blog sobat sekarang telah memiliki buku tamu.Sepertinya bahasan kita di panduan blogspotkali ini tentang cara membuat buku tamu di blog telah selesai.Semoga artikel saya ini dapat bermanfaat untuk sobat sekalian.Sampai jumpa di panduan blogspot selanjutnya.



9. Cara Custom Domain Di Blogger




Cara Custom Domain Di Blogger/blogspot


Kali ini kita akan membahas cara custom domain di blogger/blogspot.Yang dimaksud custom domain di blogger dalam posting saya kali ini adalah mengganti alamat blog di blogger atau blogspot menjadi alamat blog dengan domain kita sendiri atau Top Level Domain (TLD),contoh andrey-komei.blogspot.com menjadi andreykusanagi.com.Mengganti sub domain blogger atau blogspot dengan Top  Level Domain,Tentu saja mempunyai kelebihan dibanding tetap memakai sub domain blogger.


Berikut beberapa kelebihan custom domain

*Tampil Lebih Profesional 

Memakai atau menggunakan domain sendiri biasanya akan dianggap lebih profesional dibanding tetap menggunakan sub domain blogger.Apa lagi blog sobat adalah sebuah blog yang menjual barang ataupun jasa,ini sangat berpengaruh besar dalam tingkat kepercayaan para pelanggan.

*Lebih Cepat Terindex Search Engine

Bila sobat menggunakan Top Level Domain atau domain sendiri,maka konten blog sobat akan lebih cepat terindex oleh search engine (mesin pencari) seperti google,yahoo,bing dan lainnya.

Lebih Aman

Tentu sobat sekalian pernah dengar bahwa blogger bisa saja menghapus blog kita.Jika suatu saat hal tersebut menimpa sobat,sobat tidak perlu risau,yang harus sobat ingat adalah backup blog sobat secara berkala.Langkah selanjutnya adalah buat blog baru di blogger,lalu upload backup blog sobat.Dan arahkan domain domainnya ke domain milik sobat sendiri.

Di atas adalah beberapa kelebihan jika kita memakai Top Level DomainMasih banyak lagi kelebihan memakai Top Level Domain.

Untuk harga domain sangat bervariasi,mulai dari harga Rp.35.000 sampai Rp.120.000 per tahunnya.Tergantung sobat mau memilih yang mana.Sobat dapat membeli domain di mana saja.Dalam tutorial ini saya akan mengambil contoh cara custom domain di idwebhost.

*Jika sobat sudah mempunyai domain,silahkan login ke control panel domain sobat dengan username dan pasword yang telah di berikan.
*Klik Manage DNS
*Kemudian klik menu CNAME,
 *Di menu CNAME,klik go pada tambah baris baru.Kemudian di kolom Host Name isi dengan wwwdan di kolom Value isi dengan ghs.google.com.Agar domain sobat tertuju ke hosting blogger.
*Kemudian klik save change(s)
*Selesai

Pengaturan pada CNAME domain sobat telah selesai,selanjutnya pengayuran pada blog sobat di blogger.Ikuti langkah-langkah berikut

*Login ke akun blogger sobat
*Klik menu Setelan
Klik menu Penerbitan.Dan klik Domain Ubahsuaian
 *Pada menu domain ubahsuaian klik Beralih ke setelan lanjut
 *Kemudian masukan domain sobat di kolom yang disediakan,lalu isi kolom vertifikasi kata dan klikSIMPAN SETELAN.
 *Setelah itu centang mengarahkan domainsobat.com ke www.domainsobat.com dan SIMPAN SETELAN kembali,agar domain sobat bisa juga diakses walaupun tidak memakai www.
Sepertinya bahasan kita tentang cara custom domain di blogger telah selesai.Bila sobat ada pertanyaan,silahkan tulis di kolom komentar.Semoga postingan saya ini dapat bermanfaat untuk sobat sekalian.Sampai jumpa di Panduan Blogspot berikutnya.




10. Cara Membuat Menu Tab/Halaman Di Blog


Cara Membuat Menu Tab/Halaman Di Blog


Dalam Panduan Blogspot kali ini,kita akan membahas cara membuat menu tab/halaman di blog.Membuat menu tab atau menu halaman sangatlah penting,karena dengan adanya menu tab atau menu halaman tersebut para pengunjung blog kita akan lebih mudah dalam menjelajahi semua isi blog kita.Bagi sobat yang belum mengetahui apa itu menu tab/halaman,silahkan lihat gambar di bawah ini.




Cara membuat menu tab/halaman di blog sangatlah mudah.Ayo langsung saja kita mulai cara membuat menu tab/halaman di blog.Ikuti langkah-langkah berikut ini :

1.Login ke akun blogger sobat.
2.Klik Menu Rancangan.
3.Lalu klik Tambah Gadget
4.Kemudian klik/pilih Laman.
 5.Setelah masuk ke konfigurasi daftar menu Klik SIMPAN
6.Selesai,coba sobat lihat hasilnya.

Di menu tab/halaman blog saya ada menu halaman beranda,panduan blogspot,sitemap dan download software gratis.Mau tahu cara buatnya.Ayo ikuti langkah-langkah berikut ini :

1.Klik Posting
2. Lalu klik Edit Laman
3.Pada menu Edut Laman,sobat bisa membuat halaman dengan cara klik Tambah Baru
4.Tulis judul dan isi halaman yang sobat ingin buat di kolom yang telah disediakan.Jika sudah selesai klik Tayangkan Laman.Sobat setiap saat bisa mengedit halaman sobat di menu edit laman.
5.Selesai.

Wah akhirnya menu tab/halaman sobat selesai juga.Jika ingin mendesain menu tab/halaman sobat,silahkan baca Cara mendeain template di blog.Sepertinya bahasan kita tentang Cara Membuat Menu Tab/Halaman Di Blog telah selesai.Semoga artikel saya ini bermanfaat,jika ada pertanyaan silahkan saja tulis di kolom komentar.Sampai jumpa di Panduan Blogspot berikutnya.



11.  Cara Mendaftarkan Blog Ke Google


Cara Mendaftarkan Blog Ke Google


Panduan Blogspot kali ini kita akan membahas cara mendaftarkan blog ke google.Google adalah mesin pencari nomor 1 di dunia,maka dari itu agar blog kita banyak pengunjungnya kita harus mendaftarkan blog kita ke mesin pencari google.Agar setiap postingan yang telah kita buat bisa terindex mesin pencari google.Agar lebih mempersingkat waktu,ayo segera kita mulai panduan cara mendaftarkan blog ke google.



Ikuti langkah-langkah berikut ini :

1.Silahkan DISINI
2.masukan alamat blog sobat di kolom URL,jangan lupa isi kolom vertifikasi kata dan kemudian klikSubmit Request
 3.Setelah itu,klik menu webmaster tools yang berada di pojok kanan sobat.Lihat gambar berikut
 *Serelah sobat masuk ke halaman Webmaster tools,pilih/klik manage site.Lalu klik Add or remove owners
 *Pada menu Vertification details,klik Verify using a different method
*Pada menu Verify ownership,pilih Add a meta tag to your site's home page.Kemudian copy semua meta tag yang diberikan.
Okey,setelah sobat copy kode meta tag yang telah diberikan,ayo segera kita pasang di template blog sobat.Silahkan ikuti langkah-langkah berikut ini :

*Login ke akun blogger sobat
*Klik menu RANCANGAN
*Lalu klik Edit HTML
*Masukan kode meta tag tadi di bawah kode <head>
Agar lebih mudah mencari kodenya klik Ctrl+F
*Lalu klik SIMPAN TEMPLATE
*Selesai

Untuk tampilan antarmuka blogger yang diperbarui
*Login ke akun blogger sobat
*Pilih menu Template
 *Lalu klik Edit HTML
 *Lalu klik Proceed
 *Masukan kode meta tag tadi di bawah kode <head>
agar lebih mudah mencari kodenya klik Ctrl+F.
*Lalu klik Save Template
*Selesai

Semoga artikel saya tentang cara mendaftarkan blog ke google dapat bermanfaat untuk sobat sekalian.Bila ada pertanyaan,silahkan tulis di kolom komentar di bawah ini.Sampai jumpa dipanduan blogspot berikutnya.





12.   Memasang Tombol Like Facebook Di Blog


Cara Memasang Tombol Like Facebook Di Blogspot


Panduan Blogspot kali ini saya akan memberikan tips tentang cara memasang tombol like facebook di blogspot.Mungkin ada beberapa dari sobat sekalian yang belum mengetahui bagaimana cara memasang tombol like facebook di bawah postingan blog.Bagi sobat sekalian yang belum tahu bagaimana cara memasangnya,silahkan ikutilangkah-langkah berikut ini


*Login ke akun blogger sobat
*klik menu RANCANGAN
*Lalu klik Edit HTML
*Beri tanda centang pada kotak Expand Widget Template
*Cari kode <data:post.body/> 
biar lebih cepat dalam mencari kode tersebut,gunakan Ctrl+F pada keyboard sobat.
* Masukan kode berikut di bawah kode <data:post.body/>  

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:410px; height:40px;'/>
</b:if>

*Setelah itu,klik SIMPAN
*Selesai 

Bagi sobat yang menggunakan antarmuka blogger yang diperbarui.
*Login ke akun blogger sobat
*Pilih menu Template
*Lalu klik Edit HTML
*Beri tanda centang pada kotak Expand Widget Template
*Cari kode <data:post.body/> 
biar lebih cepat dalam mencari kode tersebut,gunakan Ctrl+F pada keyboard sobat.
* Masukan kode berikut di bawah kode <data:post.body/>  

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:410px; height:40px;'/>
</b:if>

*Lalu klik Save Template
Selesai

Coba sobat lihat hasilnya.Bagaimana bagus tidak?.Tutorial di atas adalah Cara memasang tombol like facebook di bawah postingan blog.Jika sobat ingin memasang tombol like di atas postingan blog,caranya sama,tetapi taruh kode di atas di bawah kode <div class='post-header-line-1/>

Jika sobat punya pertanyaan,silahkan tulis di kolom komentar yang ada di bawah ini.Semoga artikel saya tentang cara memasang tombol like facebook di blog,dapat bermanfaat untuk sobat blogger sekalian.Sampai jumpa di Panduan Blogspot berikutnya.



13.  Cara Membuat Tulisan Copyright Di Blog


Cara Membuat Tulisan Copyright di Blog


Panduan Blogspot kali ini kita akan membahas tentang cara membuat tulisan copyright di blog.Salah satu cara agar blog kita tampil lebih profesional,ada baiknya kita membuat tulisan copyright di template blog kita.Tulisan copyright ini juga berfungsi untuk mengetahui siapa pemilik blog,siapa yang mendesain template blog kita dan info-info yang lainnya.Untuk mempersingkay waktu,ayo langsung saja kita mulai cara membuat tulisan copyright di blog.


Ikuti langkah-langkah berikut ini :
1Login ke akun blogger sobat
2.Klik menu RANCANGAN
3.Pilih/Klik Edit HTML
4.Cari kode  ]]></b:skin>
5.Jika sudah ketemu,masukan kode berikut tepat di atas kode ]]></b:skin>

.copyright{
text-align: center;
padding-top:5px;
padding-bottom:5px;
font:normal 80% Verdana,Trebuchet,Arial,Sans-serif;}

6.Kemudian cari kode </body>
agar lebih cepat mencarinya gunakan Ctrl+F
7.Jika sudah ketemu,masukan kode di bawah ini di atas kode </body>

<div class='copyright'>Copyright &#169; 2011 di sini kata-kata yang sobat inginkan</div>

Contoh : <div class='copyright'>Copyright &#169; 2011 <a href='http://urlblogsobat.blogspot.com/'>judul blog sobat</a>powered by: <a href='http://www.blogger.com/'>Blogger</a></div>

8.Yang terakhir klik SIMPAN TEMPLATE
9.Selesai

Bagi sobat yang menggunakan antarmuka blogger yang diperbarui,silahkan ikuti langkah-langkah berikut

1.Login ke akun blogger sobat
2.Klik Menu Template
3Klik Edit HTML
4.Cari kode  ]]></b:skin>
5.Jika sudah ketemu,masukan kode berikut tepat di atas kode ]]></b:skin>


.copyright{
text-align: center;
padding-top:5px;
padding-bottom:5px;
font:normal 80% Verdana,Trebuchet,Arial,Sans-serif;}

6.Kemudian cari kode </body>
agar lebih cepat mencarinya gunakan Ctrl+F
7.Jika sudah ketemu,masukan kode di bawah ini di atas kode </body>


<div class='copyright'>Copyright &#169; 2011 di sini kata-kata yang sobat inginkan</div>

Contoh : <div class='copyright'>Copyright &#169; 2011 <a href='http://urlblogsobat.blogspot.com/'>judul blog sobat</a>powered by: <a href='http://www.blogger.com/'>Blogger</a></div>

8.Yang terakhir klik Save Template
9.Selesai

Jika sobat ingin meletakkan tulisan copyright tersebut di sebelah kiri bawah,sobat tinggal mengganti kode float dengan left,jika ingin berada di sebelah kanan,ganti kode floatnya dengan right

Semoga artikel saya ini bisa bermanfaat untuk sobat-sobat blogger sekalian.Jika sobat mempunyai pertanyaan,kritik ataupun saran,silahkan tulis di kolom komentar yang berada di bawah postingan.Sampai jumpa di Panduan Blogspot berikutnya.Salam Andrey Kusanagi.



14 . Cara Membuat Komentar Admin Blog Berwarna 


Cara Membuat Komentar Admin Blog Berwarna


Dalam Panduan Blogspot kali ini,kita akan membahas Cara membuat komentar admin blog berwarna.Agar komentar admin/pemilik blog berbeda dengan komentar para pengunjung blog,maka kita harus membuat komentar kita berwarna.Agar para pengunjung blog kita mengetahui bahwa kitalah pemilik blog yang sedang mereka kunjungi.Cara membuatnya tidaklah sulit,silahkan sobat ikuti langkah-langkah berikut ini :


1.Login ke akun blogger sobat
2.Klik RANCANGAN
3.Klik Edit HTML
4.Lalu centang kotak Expand Template Widget.
5.Copy paste kode berikut tepat di atas kode ]]></b:skin>


.author-comments {
background: #D6E7FF;
border: 2px solid #0055E3;
padding: 5px;
}

Sobat dapat merubah warna bakground dan border,sesuai keinginan sobat.

6.Cari kode berikut ini :

<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
</dt>

7.Jika sudah ketemu,masukan kode yang berwarna biru seperti yang saya lakukan,lihat kode di bawah ini.

<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
</dt>
<b:if cond='data:comment.author == data:post.author'>
<dd class='author-comments'>
<p><data:comment.body/></p>
</dd>
<b:else/> <dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
</b:if> <dd class='comment-footer'>
<span class='comment-timestamp'>

Ingat! harus sama persis dengan yang saya buat di atas.
8.Klik SIMPAN TEMPLATE
9.Selesai.

Jika sobat menggunakan antarmuka blogger yang diperbarui,silahkan ikuti langkah-langkah berikut ini:

1.Login ke akun blogger sobat
2.Klik menu Template
3.Klik menu Edit HTML
4.Lalu centang kotak Expand Template Widget.
5.Copy paste kode berikut tepat di atas kode ]]></b:skin>


.author-comments {
background: #D6E7FF;
border: 2px solid #0055E3;
padding: 5px;
}

Sobat dapat merubah warna bakground dan border,sesuai keinginan sobat.

6.Cari kode berikut ini :

<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
</dt> 

7.Jika sudah ketemu,masukan kode yang berwarna biru seperti yang saya lakukan,lihat kode di bawah ini.


<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
</dt>
<b:if cond='data:comment.author == data:post.author'>
<dd class='author-comments'>
<p><data:comment.body/></p>
</dd>
<b:else/> <dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
</b:if> <dd class='comment-footer'>
<span class='comment-timestamp'>

Ingat! harus sama persis dengan yang saya buat di atas.
8.Klik Save Template.
9.Selesai.

Coba sobat lihat hasilnya,semoga artikel saya tentang cara membuat komentar admin blog berwarna dapat bermanfaat untuk sobat sekalian.Jika sobat punya pendapat dan pertanyaan,silahkan sobat tulis di kolom komentar yang ada di bawah ini.Sampai jumpa di Panduan Blogspot berikutnya.



15 . Pasang Script Anti Copy Paste Di Blog 


Script Anti Copy Paste


Dalam Panduan Blogspot kali ini,saya akan membahas cara agar blog kita aman dari tukang copas (copy paste).Mungkin sobat sekalian sudah tidak asing lagi dengan kata Tukang copas.Ya,tukang copas adalah orang yang mengcopy paste artikel blog kita.

Tetapi sekarang ini banyak tukang copas yang tidak memberikan link sumber dari artikel yang mereka copy paste.Maka dari itu saya akan memberikan tips agar setiap artikel blog kita yang di copy paste oleh orang lain akan memberikan link URL blog kita.Ayo segera kita pasangScript Anti Copy Paste di blog kita.

Ikuti langkah-langkah berikut ini :

1.Login ke akun blogger sobat
2.Klik menu RANCANGAN
3.Klik menu Edit HTML
4.Masukan script berikut di bawah kode <head>

<script type='text/javascript'>
function addLink() {
    var body_element = document.getElementsByTagName(&#39;body&#39;)[0];
    var selection;
    selection = window.getSelection();
    var pagelink = &quot;<br/><br/> Read more at: <a href='&quot;+document.location.href+&quot;'>&quot;+document.location.href+&quot;</a><br/>Copyright  www.andreykusanagi.com Under Common Share Alike Atribution&quot;; // change this if you want
    var copytext = selection + pagelink;
    var newdiv = document.createElement(&#39;div&#39;);
    newdiv.style.position=&#39;absolute&#39;;
    newdiv.style.left=&#39;-99999px&#39;;
    body_element.appendChild(newdiv);
    newdiv.innerHTML = copytext;
    selection.selectAllChildren(newdiv);
    window.setTimeout(function() {
        body_element.removeChild(newdiv);
    },0);
}document.oncopy = addLink;
</script>

Ganti URL www.andreykusanagi.com dengan url blog sobat.
5.Kemudian klik SIMPAN TEMPLATE.
6.Selesai

Bagi sobat yang menggunakan antarmuka blogger yang diperbarui,silahkan ikuti langkah berikut

1.Login ke akun blogger sobat
2.Klik menu Template.
3.Klik menu Edit HTML
4.Masukan script berikut di bawah kode <head>

<script type='text/javascript'>
function addLink() {
    var body_element = document.getElementsByTagName(&#39;body&#39;)[0];
    var selection;
    selection = window.getSelection();
    var pagelink = &quot;<br/><br/> Read more at: <a href='&quot;+document.location.href+&quot;'>&quot;+document.location.href+&quot;</a><br/>Copyright  www.andreykusanagi.com Under Common Share Alike Atribution&quot;; // change this if you want
    var copytext = selection + pagelink;
    var newdiv = document.createElement(&#39;div&#39;);
    newdiv.style.position=&#39;absolute&#39;;
    newdiv.style.left=&#39;-99999px&#39;;
    body_element.appendChild(newdiv);
    newdiv.innerHTML = copytext;
    selection.selectAllChildren(newdiv);
    window.setTimeout(function() {
        body_element.removeChild(newdiv);
    },0);
}document.oncopy = addLink;
</script>

Ganti URL www.andreykusanagi.com dengan url blog sobat.
5.Kemudian klik Save Template.
6.Selesai.

Sekarang blog kita telah aman dari para tukang copas.Bila ada orang yang mengcopy paste artikel dari blog kita,maka di bawah artikel tersebut akan tercantum url blog kita.Semoga artikel saya tentang Script Anti Copy Paste dapat bermanfaat.Sampai jumpa di Panduan Blogspot berikutnya.



16 . Cara Membuat Dan Memasang Tanda Tangan Di Blog 



Cara Membuat Dan Memasang Tanda Tangan Di Blog


Panduan Blogspot kali ini kita akan membahas tentang cara membuat dan memasang tanda tangan di blog.Agar blog kita ingin kelihatan lebih cantik,tidak ada salahnya bila kita memasang tanda tangan di blog ataupun di setiap postingan.Cara membuat dan memasang tanda tangan di blogtidaklah sulit,sobat hanya butuh beberapa menit untuk membuat dan memasangnya di blog.Jika sobat blogger sekalian tertarik untuk membuat dan memasang tanda tangan di blog,silahkan ikuti beberapa langkah berikut.

1.Kunjungi situs http://www.mylivesignature.com
2.Setelah itu klik START NOW.
3.Setelah kita klik start now,kita akan dibawa ke halaman Creating new a signature of Font.Di halaman tersebut ada 4 pilihan,kita pilih/klik Using the Signature Creation Wizard.
4.Selanjutnya kita akan dibawa ke halaman Step 1.Enter The Name.Silahkan sobat isi kolom yang telah di sediakan dengan nama yang sobat inginkan.Jika sudah selesai,klik Next Step.
5.Pada Step 2.Silahkan sobat pilih gaya tulisan yang sobat sukai.Jika sudah klik Next Step  
6.Pada STEP 3.Silahkan sobat pilih ukuran huruf yang sobat inginkan.Lalu klik NEXT STEP.
7.Pada STEP 4.Di situ kita bisa menentukan warna background dan warna tulisan.Jika sudah klik NEXT STEP.
8.Pada STEP 5.silahkan sobat pilih tulisan dengan kemiringan yang sobat inginkan.Jika sudah,klik NEXT STEP.
9.Setelah itu kita akan dibawa ke halaman Finished! The Signature Is Ready.Pada halaman tersebut,silahkan sobat pilih/klik Want to use the signature.
10.Pada halaman Generating signature code,Silahkan sobat klik Generate HTML Code.
11.Selanjutnya pada halaman Generating HTML Code,silahkan sobat pilih/klik Generate a code for My Handwritten Signature.
12.Kemudian Copy semua kode HTML yang diberikan.


Sekarang kita akan memasang tanda tangan tersebut di blog.Silahkan ikuti langkah-langkah berikut.



1.Login ke akun blogger sobat.
2.Klik menu RANCANGAN.
3.Klik Tambah Gadget.
4.Lalu klik HTML/Javascript
5.Paste kan code html yang kita copy tadi.
6.Klik SIMPAN.
7.Selesai.



Bagi sobat yang menggunakan tampilan antarmuka blogger yang diperbarui,silahkan ikuti beberapa angkah berikut.



1.Login ke akun blogger sobat.
2.Klik menu Layout.
3.Klik Tambah Gadget.
4.Lalu klik HTML/Javascript
5.Paste kan code html yang kita copy tadi.
6.Klik SIMPAN.
7.Selesai.



Sekarang coba sobat lihat hasilnya.
Semoga postingan saya tentang cara membuat dan memasang tanda tangan di blog dapat bermanfaat untuk sobat sekalian.Sampai jumpa di Panduan Blogspot berikutnya.



17 . Cara Membuat Daftar Isi Otomatis 


Cara Membuat Daftar Isi Otomatis Di Blog


Panduan Blogspot kali ini kita akan membahas tentang cara membuat daftar isi otomatis di blog.Daftar isi adalah sesuatu yang sangat penting dalam sebuah blog,karena dengan adanya daftar isi,maka para pengunjung akan lebih mudah menjelajai setiap postingan blog kita.Daftar isi ini bisa sobat pasang di sidebar,postingan ataupun halaman.Kalau saya memasang daftar isi di halaman blog saya,coba klik disini.Silahkan sobat ikuti beberapa langkah berikut.


Cara Membuat Daftar Isi Di Sidebar.

1.Login ke akun blogger sobat.
2.Klik menu RANCANGAN.
3.Klik Tambah Gadget 
4.Pilih/klik HTML/Javascipt.
5.Masukan kode berikut

<script src="http://kcdaftarisi.googlecode.com/files/daftarisi.js" type="text/javascript">
</script>
<script src="http://www.andreykusanagi.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Ganti tulisan www.andreykusanagi.com dengan alamat blog sobat.

6.Klik SIMPAN.
7.Selesai

Bagi sobat yang menggunakan antarmuka blogger yang diperbarui,ikuti lankah-langkah berikut.

1.Login ke akun blogger sobat.
2.Klik menu Layout.
3.Klik Tambah Gadget 

4.Pilih/klik HTML/Javascipt.
5.Masukan kode berikut

<script src="http://kcdaftarisi.googlecode.com/files/daftarisi.js" type="text/javascript">
</script>
<script src="http://www.andreykusanagi.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Ganti tulisan www.andreykusanagi.com dengan alamat blog sobat.

6.Klik SIMPAN.
7.Selesai

Cara Membuat Daftar isi Blog Di Halaman

 1.Login ke akun blogger sobat.
 2.Klik Entri Baru.
3.Klik Edit Laman.
4.Klik Tambah Laman.
5.Karena kode daftar isi ini berbentuk kode javascript,maka Edit HTML pada kotak posting.
6.Setelah Itu,masukan kode berikut di dalam kotak posting.

<script src="http://kcdaftarisi.googlecode.com/files/daftarisi.js" type="text/javascript">
</script>
<script src="http://www.andreykusanagi.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Ganti tulisan www.andreykusanagi.com dengan alamat blog sobat.

7.Terakhir,klik TERBITKAN ENTRI.
8.Selesai.

bagaimana hasilnya? Apakah bagus?,Semoga postingan saya tentang cara membuat daftar isi di blog dapat bermanfaat untuk semua sobat sekalian.Jangan lupa tulis komentarnya ya,,,,.Sampai jumpa di Panduan Blogspot berikutnya.



18 . Cara Membuat Breadcrumds Di Blog 


Cara Membuat Breadcrumbs Di Blogspot


Panduan Blogspot kali ini kita akan membahastentang cara membuat breadcrumds di blogspot.Mungkin dari beberapa sobat blogger sekalian ada yang belum mengetahui fungsi dan manfaat dari breadcrumds ini.Breadcrumds berguna agar para pengunjung blog kita athu dimana lokasi mereka berada di dalam dokumen blog kita.Coba sobat lihat gambar di samping.Cara membuatnya tidaklah terlalu sulit,sobat hanya membutuhkan waktu beberapa menit saja.


Bagi sobat yang berminat memasang breadcrumds di blog,silahkan ikuti beberapa langkah berikut
1.Login ke akun blogger sobat
2.Klik menu Rancangan
3.Klik Edit HTML
4.Centang Expand Template Widget
5.Cari kode  ]]></b:skin>
.6.Masukan kode berikut tepat di atas kode  ]]></b:skin>

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef;
}
7.Kemudian cari kode berikut  <div class='post hentry'>
agar lebih cepat menemukan kode tersebut,gunakan Ctrl+F
8.Jika sudah ketemu,masukan kode di bawah ini tepat di bawah kode  <div class='post hentry'>

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> &#187;
<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>
8.Klik SIMPAN
9.Selesai.

Bagi sobat yang menggunakan tampilan antarmuka blogger yang diperbarui,silahkan ikuti beberapa langkah berikut
1.Login ke akun blogger sobat.
2.Klik Menu Template
3.Klik Edit HTML
4.Centang Expand Template Widget
5.Cari kode  ]]></b:skin>

.6.Masukan kode berikut tepat di atas kode  ]]></b:skin>



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

7.Kemudian cari kode berikut  <div class='post hentry'>

agar lebih cepat menemukan kode tersebut,gunakan Ctrl+F
8.Jika sudah ketemu,masukan kode di bawah ini tepat di bawah kode  <div class='post hentry'>


<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> &#187;
<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>

8.Klik SIMPAN
9.Selesai.

Coba sobat lihat hasilnya.Semoga postingan saya tentang cara membuat breadcrumds di blogspot bisa bermanfaat.Sampai jumpa di Panduan Blogspot berikutnya.



19 . Cara Memasang Like Box Facebook Di Blog 


Cara Memasang Like Box Facebook Di Blogspot


Panduan Blogspot kali ini kita akan membahas tentang cara memasang like box facebook di blog.Postingan ini saya tulis karena salah Satu teman kita yang bernama febryrambe pada postingan saya sebelumnya di Cara membuat buku tamu di blog bertanya tentang bagaimana Cara memasang like box facebook di blogspot.Caranya sangatlah mudah,sobat hanya membutuhkan beberapa menit saja untuk membuat dan memasang like box facebook tersebut di blog sobat.Tetapi ada 2 syarat hal yang harus penuhi yaitu sobat harus mempunyai akun facebook dan juga akun blogger.

Okey tanpa panjang lebar lagi silahkan sobat ikuti beberapa langkah berikut,kita akan membuat halaman facebook kita terlebih dahulu.

1.Login ke akun facebook sobat.
2.Setelah sobat Login ke akun facebook sobat,lalu klik DISINI.
3.Setelah itu sobat pilih/klik kategori halaman yang berhubungan dengan blog sobat,di situ ada 6 kategori.Jangan lupa beri tanda centang pada pilihannya.
4.Pada menu Foto Profil,,Masukan foto atau gambar yang sobat inginkan untuk menjadi foto/gambar halaman facebook sobat.
5.Pada menu Dapatkan Penggemar,,Undang semua teman sobat uuntuk bergabung di halaman facebook sobat.
6.tahap terakhir,,,Tulis informasi umum tetntang halaman facebook sobat agar para pengunjung mengerti isi dari halaman sobat.
7.Selesai

Halaman Facebook sobat telah jadi,sekarang kita tinggal membuat like box facebook sobat.Mau tahu caranya?????.Ikuti beberapa langkah berikut.

1.Copy alamat url halaman facebook sobat.
2.Lalu Klik Tambahkan Kotak Suka pada pilihan Promosikan Halaman Ini Di Situs Web Anda.
3.Masukan alamat URL halaman facebook sobat yang sudah sobat copy tadi di Facebook Page URL
4.Terakhir Klik Get Code
5.Copy seluruh kode yang di berikan(kode no.1 dan no.2).Simpan dahulu semua kode tersebut di notepad.

Langkah Terakhir,kita tinggal memasang like box facebooknya di blog,ikuti langkah berikut.
1.Login ke akun blogger sobat.
2.Klik menu RANCANGAN.
3.Klik Tambah Gadget
4.Klik HTML/Javascript
5.Masukan semua kode yang sudah sobat copy tadi.
6.Selesai.

Bagi sobat yang menggunakan tampilan antarmuka blogger yang diperbarui,ikuti langkah berikut.
1.Login ke akun blogger sobat.
2.Klik menu Layout/Tata Letak
3.Klik Tambah Gadget
4.Klik HTML/Javascript
5.Masukan semua kode yang sudah sobat copy tadi.
6.Selesai.
Coba sobat lihat hasilnya.Jika sobat punya pertanyaan,silahkan tulis di kolom komentar.Dan jangan lupa like like box facebook saya ya(hehehe).Sampai jumpa di Panduan Blogspot berikutnya.



20 . Membuat Artikel Terkait Dengan Scroll Box 


Cara Membuat Artikel Terkait Dengan Scroll


Panduan Blogspot kali ini kita akan membahas tentang cara membuat artikel terkait di bawah postingan dengan scrool down.Dengan memasangartikel terkait dalam setiap postingan blog kita,maka serp setiap postingan kita akan mendapat tempat yang bagus di mesin pencari seperti google,selain itu,dengan kita memasang artikel terkait di bawah postingan maka pageview atau trafik blog kita akan semakin tinggi
.Cara memasangnya tidaklah terlalu sulit.Sobat sekalian hanya membutuhkan waktu beberapa menit.


Langsung saja kita mulai memasang artikel terkait di bawah postingan dengan scroll down.Ikuti beberapa langkah berikut.

1.Login ke akun blogger sobat
2.Klik menu template.
3.Lalu klik Edit HTML
4.Kemudian centang expand template widget
5.Cari kode <data:post.body/>
6.Masukan kode berikut tepat di bawah kode <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Artikel Terkait:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>

7.Cari Kode ]]></b:skin>,,,,,,kemudian paste kan kode di bawah ini tepat di atas kode ]]></b:skin>

.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}

8.Klik Simpan Template
9.Selesai

Bagi sobat yang menggunakan tampilan antarmuka blogger yang lama,ikuti langkah berikut

1.Login ke akun blogger sobat.
2.Klik menu RANCANGAN
3.Lalu klik Edit HTML
4.Kemudian centang expand template widget
5.Cari kode <data:post.body/>
6.Masukan kode berikut tepat di bawah kode <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Artikel Terkait:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>


7.Cari Kode ]]></b:skin>,,,,,,kemudian paste kan kode di bawah ini tepat di atas kode ]]></b:skin>


.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}



8.Klik Simpan Template

9.Selesai

Coba sobat lihat hasilnya,,,Jika ada pertanyaan,kritik ataupun saran,silahkan sobat tulis di kolom komentar yang berada di bawah.Semoga postingan saya tentang cara membuat artikel terkait di bawah postingan dengan scrool down dapat bermanfaat.Sampai jumpa di Panduan Blogspotberikutnya.



21 . Cara Memasang Widget Animasi Naruto Di Blog 


Pasang Widget Animasi Naruto Vs Sasuke Di Blog


Panduan Blogspot kali ini kita akn membahas tentang cara memasang widget animasi naruto vs sasuke.Kali ini kita membahas tentang widget animasi naruto ini karena saya adalah salah satu penggemar berat dari serial manga dan anime naruto.Mungkin diantara sobat sekalian juga ada penggemar manga dan anime naruto,Jadi widget ini sangat cocok untuk kita para penggemar naruto.Cara memasang widget ini tidaklah terlalu sulit,sobat hanya membutuhkan beberapa menit saja untuk memasangnya di blog sobat.

Langsung saja kita mulai.Ikuti Beberapa langkah berikut :
1.Login ke akun blogger sobat
2.Klik menu Tata Letak
3.Klik Tambah Gadget
4.Klik HTML/Javascript
5.Masukan kode berikut

<div style="position: fixed; bottom: 0px; left: 20px;width:110px;height:80px;"><a href="http://www.andreykusanagi.com"target="_blank"><img src="http://i1210.photobucket.com/albums/cc417/kusanagiblog/NarutoVSSasuke.gif"alt="gambar"title="Panduan Blogspot"/></a></div>

6.Klik SIMPAN
7.Selesai

Akhirnya widget animasi naruto telah terpasang di blog sobat.Semoga postingan saya tentang Cara memasang widget animasi naruto di blog dapat bermanfaat.Sampai jumpa semua di Panduan Blogspot berikutnya.



22 . Menampilkan Emoticon Yahoo Di Komentar Blog 


Cara Menampilkan Emoticon Yahoo Di Komentar Blog


Pada Panduan Blogspot kali ini kita akan membahas tentang cara menampilkan emoticon yahoo di komentar blog.Mungkin sobat sekalian pernah mengunjungi suatu blog yang pada kolom komentarnya terdapat emoticon,mungkin dari beberapa sobat sekalian belum mengetahui cara menampilkan emoticon yahoo di komentar blog.Caranya sangatlah mudah,sobat sekalian hanya membutuhkan beberapa menit saja untuk memasang emoticon di kolom komentar blog sobat.Kali ini kita akan menggunakan emoticon yahoo.tentu sobat tahu kan dengan emoticon yahoo?.Ayo tanpa panjang lebar lagi,langsung saja kita mulai.



Ikuti beberapa langkah berikut :
1.Login ke akun blogger sobat
2.Klik menu Template
3.Klik Edit HTML
4.Centang kotak Expand Template Widget
5.Cari Kode </body>
6.Masukan kode berikut,tepat di atas kode </body>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='http://andreykusanagi.googlecode.com/files/yahookusanagi.js' type='text/javascript'/>
</b:if>

7.Setelah itu cari kode <h4 id='comment-post-message'><data:postCommentMsg/></h4>
8.Jika sudah ketemu,
   masukan kode berikut di bawah kode <h4 id='comment-post-message'><data:postCommentMsg/></h4>

<div style='width:550px;text-align: center;border: 1px solid #ccc;padding: 2px 2px;margin-top: 15px;font-style:bold;color:#000;font-weight:normal;font-size:10px;'>
  <b>
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif' width='18'/>:))
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif' width='18'/>;))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif' width='18'/>;;)
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif' width='18'/>:D
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' width='18'/>;)
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif' width='18'/>:p
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif' width='22'/>:((
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif' width='18'/>:)
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif' width='18'/>:(
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif' width='18'/>:X
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif' width='18'/>=((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif' width='18'/>:-o
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif' width='20'/>:-/
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif' width='18'/>:-*
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif' width='18'/>:|
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif' width='24'/>8-}
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif' width='31'/>:)]
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif' width='44'/>~x(
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif' width='30'/>:-t
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif' width='18'/>b-(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif' width='18'/>:-L
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif' width='34'/>x(
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif' width='28'/>:-p
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif' width='30'/>=))
  </b>
  </div>

9.Klik Save Template
10 Selesai

Bagi Sobat yang menggunakan tampilan antarmuka blogger byang lama,silahkan ikuti beberapa langkah berikut :
1.Login ke akun blogger sobat
2.Klik menu RANCANGAN
3.Klik Edit HTML
4.Centang kotak Expand Template Widget
5.Cari Kode </body>
6.Masukan kode berikut,tepat di atas kode </body>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='http://andreykusanagi.googlecode.com/files/yahookusanagi.js' type='text/javascript'/>
</b:if>

7.Setelah itu cari kode <h4 id='comment-post-message'><data:postCommentMsg/></h4>
8.Jika sudah ketemu,
   masukan kode berikut di bawah kode <h4 id='comment-post-message'><data:postCommentMsg/></h4>

<div style='width:550px;text-align: center;border: 1px solid #ccc;padding: 2px 2px;margin-top: 15px;font-style:bold;color:#000;font-weight:normal;font-size:10px;'>
  <b>
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif' width='18'/>:))
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif' width='18'/>;))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif' width='18'/>;;)
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif' width='18'/>:D
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' width='18'/>;)
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif' width='18'/>:p
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif' width='22'/>:((
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif' width='18'/>:)
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif' width='18'/>:(
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif' width='18'/>:X
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif' width='18'/>=((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif' width='18'/>:-o
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif' width='20'/>:-/
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif' width='18'/>:-*
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif' width='18'/>:|
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif' width='24'/>8-}
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif' width='31'/>:)]
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif' width='44'/>~x(
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif' width='30'/>:-t
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif' width='18'/>b-(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif' width='18'/>:-L
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif' width='34'/>x(
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif' width='28'/>:-p
  <img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif' width='30'/>=))
  </b>
  </div>

9.Klik SIMPAN
10 Selesai

Coba sobat lihat hasilnya,somoga tulisan saya tentang Cara menampilkan emoticon yahoo di komentar blog  dapat bermanfaat untuk sobat sekalian.Sampai jumpa di Panduan Blogspotberikutnya.



23 . Mengganti Posting Lama,Baru Dan Beranda Dengan Gambar 


Cara Mengganti Posting Lama,Baru Dan Beranda Dengan Gambar


Panduan Blogspot kali ini kita akan membahas tentang cara mengganti posting lama,baru dan beranda dengan gambar.Coba sobat lihat tampilan bawah blog saya,di situ ada ada sebuah gambar,yang bila sobat klik gambar rumah,sobat akan dibawa ke halaman beranda blog saya,dan bila sobat klik tanda panah ke kiri,sobat akan dibawa ke halaman postingan saya sebelumnya dan bila sobat klik tanda panah ke kanan,maka sobat akan dibawa ke halaman terbaru setelah postingan saya ini.Apakah sobat sekalian tertarik untuk membuatnya di blog sobat?.



Jika sobat tertarik untuk mengganti posting lama,baru dan beranda menjadi gambar silahkan sobat ikuti beberapa langkah berikut,sobat hanya membutuhkan beberapa menit saja untuk membuatnya.

1.Login ke akun blogger sobat
2.Klik menu TEMPLATE
3.Klik EDIT HTML
4.Centang Expand Template Widget
5.Kemudian cari kode beranda yaitu  <data:homeMsg/>
jika sudah ketemu,hapus kode tersebut dan ganti dengan kode
<img src='http://i1210.photobucket.com/albums/cc417/kusanagiblog/beranda.png'/>

6.Kemudian cari kode posting lama yaitu <data:olderPageTitle/>
jika sudah ketemu,hapus dan gantii dengan kode
<img src='http://i1210.photobucket.com/albums/cc417/kusanagiblog/ButtonPageBack.png'/>

7.Setelah itu kita cari kode posting baru yaitu <data:newerPageTitle/>
jika sudah ketemu,hapus kode tersebut dan ganti dengan kode
  <img src='http://i1210.photobucket.com/albums/cc417/kusanagiblog/ButtonPageNext.png'/>

8.Terakhir klik Save Template
9.Selesai

Bagi sobat yang menggunakan tampilan antarmuka blogger yang lama,silahkan ikuti langkah berikut
1.Login ke akun blogger sobat
2.Klik Menu RANCANGAN
3.Klik EDIT HTML

4.Centang Expand Template Widget
5.Kemudian cari kode beranda yaitu  <data:homeMsg/>
jika sudah ketemu,hapus kode tersebut dan ganti dengan kode
<img src='http://i1210.photobucket.com/albums/cc417/kusanagiblog/beranda.png'/>

6.Kemudian cari kode posting lama yaitu <data:olderPageTitle/>
jika sudah ketemu,hapus dan gantii dengan kode
<img src='http://i1210.photobucket.com/albums/cc417/kusanagiblog/ButtonPageBack.png'/>


7.Setelah itu kita cari kode posting baru yaitu <data:newerPageTitle/>
jika sudah ketemu,hapus kode tersebut dan ganti dengan kode
  <img src='http://i1210.photobucket.com/albums/cc417/kusanagiblog/ButtonPageNext.png'/>

8.Terakhir klik SIMPAN TEMPLATE
9.Selesai
Coba sobat lihat hasilnya,sobat juga bisa mengganti gambar tersebut dengan gambar yang sobat sukai dengan mengganti kode diatas dengan kode <img src='alamat gambar yang sobat inginkan'/>
Semoga postingan saya tentang cara mengganti posting lama,baru dan beranda dengan gambar bisa bermanfaat untuk sobat sekalian.Sampai jumpa di Panduan Blogspot berikutnya.



24 . Cara Membuat Efek Gelembung Di Blog 


Cara Membuat Efek Gelembung Di Blog


Pada Panduan Blogspot kali ini,kita akan membahas tentangcara membuat efek gelembung di blog.Mungkin beberapa sobat blogger sekalian pernah mengunjungi sebuah blog yang pada halaman blog tersebut terdapat gelembung-gelembung yang bertaburan menghiasi halaman blog tersebut.cara membuat efek gelembung berjatuhan di blog tidaklah sulit,sobat hanya membutuhkan beberapa menit saja untuk memasang efek gelembung tersebut di blog sobat.


Tanpa pangjang lebar lagi,langsung saja kita mulai pasang efek gelembung di blog.Ikuti beberapa langkah berikut
1.Login ke akun blogger sobat
2.Klik menu TEMPLATE
3.Klik EDIT HTML
4.Kemudian cari kode <body>
5.Jika sudah ketemu,masukan kode di bawah ini tepat di bawah kode <body>

<script src="http://andreykusanagi.googlecode.com/files/buble.js"></script>
 

6.Klik Simpan Template
7.Selesai

Bagi sobat yang menggunakan tampilan antarmuka blogger yang lama, silahkan ikuti beberapa langkah berikut
1.Login ke akun blogger sobat
2.Klik menu RANCANGAN
3.Klik menu Edit HTML
4.Kemudian cari kode <body>
5.Jika sudah ketemu,masukan kode di bawah ini tepat di bawah kode <body>

<script src="http://andreykusanagi.googlecode.com/files/buble.js"></script>

6.Klik Simpan Template
7.Selesai

Coba sobat lihat hasilnya,semoga postingan saya kali ini tentang cara membuat efek gelembung di blog  bisa bermanfaat.Sampai jumpa di Panduan Blogspot berikutnya.


25 . Mengedit Tag Heading Agar Lebih SEO 


Mengedit Tag Heading Agar Lebih SEO


Pada Panduan Blogspot kali ini kita akan membahas tentang salah satu cara membuat template blog lebih seo yaitu dengan mengedit tag heading blog agar lebih seo.Menurut beberapa master seo,struktur tag heading h1 (buat judul blog) sangat disukai oleh mesin pencari google.Sedangkan kebanyakan judul blog di template kita menggunakan h2 atau h3.Maka dari itu,agar blog kita lebih seo friendly,maka kita harus merubah judul tag heading h2 atau h3 menjadih1.Ayo langsung saja kita mulai.


 Silahkan sobat sekalian ikuti langkah-langkah berikut untuk mengedit tag heading blog agar lebih seo.
1.Login ke akun blogger sobat
2.Klik menu TEMPLATE atau RANCANGAN(untuk antarmuka blogger yang lama)
3.Klik EDIT HTML
4.Beri tanda centang pada Expand template Widget

5.Cari kode berikut  <h3 class='post-title entry-title'>
 jika tidak ada cari kode   <h2 class='post-title entry-title'>
(setiap template berbeda-beda,ada yang h3 atau h2)

6.Jika sudah ketemu,ganti kode h3 atau h2 menjadi h1
maka akan jadi seperti ini  <h1 class='post-title entry-title'>
dan jangan lupa sobat ganti juga penutupnya ,misalkan </h3> atau  </h2> menjadi  </h1>
berikut contoh kode yang saya terapkan di blog saya ini

<b:if cond='data:post.title'>
            <h1 class='post-title entry-title'>
              <b:if cond='data:post.link'>
                <a expr:href='data:post.link'><data:post.title/></a>
              <b:else/>
                <b:if cond='data:post.url'>
                  <b:if cond='data:blog.url != data:post.url'>
                    <a expr:href='data:post.url'><data:post.title/></a>
                  <b:else/>
                    <data:post.title/>
                  </b:if>
                <b:else/>
                  <data:post.title/>
                </b:if>
              </b:if>
            </h1>
          </b:if>

7.Jika sudah sobat ubah kode h3 atau h2 menjadi h1,,,
masukan kode di bawah ini di atas kode ]]></b:skin>

h1.post-title, .post h1 #Blog1 h1, #Blog2 h1 { font-size:1.5em; }

8.Jika sudah semua dilakukan,Klik SIMPAN TEMPLATE
9.Selesai

Semoga postingan saya tentang cara mengedit tag heading blog agar lebih seo bisa bermanfaat untu sobat sekalian.Sampai jumpa di Panduan Blogspot berikutnya.



26 . Membuat Recent Post Dengan Thumbnail Bergerak 


Cara Membuat Recent Post Dengan Thumbnail Bergerak


Panduan Blogspot kali ini kita akan membahas tentangcara membuat recent post-artikel terbaru di blog.Dengan kita memasang recent post atau postingan terbaru di sidebar blog,maka para pengunjung akan lebih mudah mengetahui postingan terbaru sobat.Recent post yang akan kita buat ini adalah recents post thumbnail yang bergerak,jadi selain para pengunjung blog kita mudah dalam mengetahui postingan terbaru kita,blog kita pun akan terlihat cantik.Cara memasangnya pun tidak terlalu sulit,sobat sekalian hanya membutuhkan beberapa menit saja untuk memasang recent post thumbnail bergerak di blog.Gimana? apa sobat mau memasangnya di blog sobat?



Coba sobat lihat pada sidebar blog saya ini,di sidebar blog saya ini,saya memasang recent post dengan thumbnail yang bergerak.
Bagi sobat sekalian yang ingin memasang recent post thumbnail bergerak silahkan ikuti beberapa langkah berikut
1.Login ke akun blogger sobat
2.Klik menu TATA LETAK (bagi sobat yang menggunakan antarmuka blogger yang lama,klik RANCANGAN)
3.Klik Tambah Gadget
4.Klik HTML/Javascript
5.Masukan kode berikut

<center><style type="text/css">
#rp_plus_img{height:300px;overflow:hidden;border:solid 0px #fff;padding:6px 10px 24px 5px;background-color:transparent;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:1px; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:60px;padding:5px;list-style:none;}
#rp_plus_img a{color:#F68629;}
#rp_plus_img .news-title{display:block;font-size:14px;font-weight:bold !important;color:#F68629;text-align:justify;}
#rp_plus_img .news-text{display:block;font-size:11px;font-weight:normal !important;color:#000000;text-align:justify;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #F68629;width:95px;height:55px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="http://theplick.googlecode.com/files/newsticker-plick.js" type="text/javascript">
</script>
<script type="text/javascript">
var speed = 1000;
var pause = 2500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 20;
var numchars = 0;
</script> <script src="http://www.andreykusanagi.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script> </ul>
</center>

Perhatikan : Ganti tulisan yang saya beri tanda kuning,dengan alamat blog sobat

6.Klik SIMPAN
7.Selesai

Coba sobat Lihat hasilnya.Semoga postingan saya kali ini tentang cara membuat recent post dengan thumbnail bergerak di blog bisa bermanfaat untuk sobat sekalian.Sampai jumpa di Panduan Blogspot berikutnya.


27 . Cara Mematikan Fungsi Klik Kanan Di Blog 


Cara Mematikan Fungsi Klik Kanan Di Blog


panduan blogspot,tutorial blogspot
 Panduan Blogspot kali ini,kita akan membahas tentang cara mematikan fungsi klik kanan pada mouse agar blog kita terlindungi dari tukang COPAS(Copy Paste).Mungkin dari beberapa sahabat blogger sekalian banyak yang kesal karena hasil karya yang sobat sekalian tuangkan di dalam blog,sering sekali di copy paste oleh orang-orang yang tidak bertanggung jawab.Karena semakin maraknya tukang COPAS,maka sobat sekalian tidak ada salahnya menggunakan script disable klik kananagar setiap postingan sobat tidak bisa di copy paste oleh orang-orang yang tidak bertanggung jawab.


Bagi sobat yang ingin mematikan fungsi klik kanan pada blog silahkan ikuti beberapa langkah berikut :
1.Login ke akun blogger sobat
2.Klik Menu Tata Letak/RANCANGAN
3.Klik Tambah Gadget
4.Klik/Pilih HTML/Javascript
5.Masukan kode berikut



Ket : Var message = "Ups Dilarang Copas"
kat Ups Dilarang Copas,bisa sobat ganti dengan kata-kata yang sobat inginkan

6.Klik Simpan Template
7.Selesai

Coba sobat masuk ke halaman blog sobat lalu sobat klik kanan.Semoga postingan saya tentangcara mematikan fungsi klik kanan pada mouse dapat bermanfaat.Sampai Jumpa di Panduan Blogspot berikutnya.



28 . Merubah Tampilan Cursor Di Blog 


Cara Merubah Tampilan Cursor di Blog


Panduan Blogspot kali ini kita akan membahas tentang cara merubah tampilan cursor pada blog.Mungkin dari beberapa sobat blogger sekalian ada yang belum mengetahui tentang cara mengganti tampilan kursor di blog.Untuk mempercantik tampilan blog kita,tidak ada salahnya sobat mengganti tampilan cursor/mouse di blog sobat.Caranya cukup mudah,sobat hanya membutuhkan beberapa menit saja untuk merubah tampilan cursor pada blog sobat.Tanpa panjang lebar lagi ayo langsung saja kita mulai.


Kali ini kita akan mengganti tampilan cursor blog kita menjadi sebuah kunai yang biasa digunakan para shinobi.
Silahkan sobat ikuti beberapa langkah berikut ini :
1.Login ke akun blogger sobat
2.Klik menu Tata Letak/Rancangan
3.Klik Tambah Gadget
4.Klik/pilih HTML/Javascript
5.Masukan kode css berikut ini

<style type="text/css">
HTML,BODY{cursor: url("http://i1210.photobucket.com/albums/cc417/kusanagiblog/spe114.gif"), auto;}
</style>

6.Klik Simpan Template
7.Selesai.

Coba sobat lihat hasilnya.Semoga postingan saya kali ini tentang cara merubah tampilan cursor di blog dapat bermanfaat.Sampai jumpa di panduan blogspot berikutnya.Sampai jumpa.



29. Cara Membuat Text Link Menjadi Miring Pada Blog


Kalo sebelumnya Textnya bergeser/membesar.... sekarang Textnya menjadi miring!!! hayo gimana tuh!!! mau tahu caranya gak??? OK Langsung aja yokkk (Ikuti Step).  


 1) Sign in akun blogger

2) Dashboard > Design > Edit HTML > Tick kotak "Expand Widget Templates"

3) Dengan menggunakan ctrl + F (tekan serentak pada keyboard), cari kode ini.
a:hover {
4) Kemudian copy paste kode di bawah kode a:hover { yang kalian cari tadi :
transform: rotate(7deg);
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);

contoh:
 a:hover {
transform: rotate(7deg);
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);

5) Sekali lagi, dengan menggunakan ctrl + F, cari kode di bawah tadi :
a:link {
6) Kemudian copy paste kode di bawah kode a:link { tadi :
transition: transform .5s ease-in;
-moz-transition: -moz-transform .5s ease-in;
-o-transition: -o-transform .5s ease-in;
-webkit-transition: -webkit-transform .5s ease-in;
Contoh:
 a:link {
transition: transform .5s ease-in;
-moz-transition: -moz-transform .5s ease-in;
-o-transition: -o-transform .5s ease-in;
-webkit-transition: -webkit-transform .5s ease-in;
7) Klik preview, jika gak ada error, klik save dan lihat hasilnya.

Selamat mencuba! :)

Tidak ada komentar:

Posting Komentar