Cara memasang iklan kumpulblogger di blog kita

Edit Blog/Setting Tampilan. Sebelum melakukan setting tampilan sesuai dengan template iklan yang anda inginkan, ada baiknya lihat dulu jenis iklan yang disediakan KumpulBlogger. Ada dua jenis iklan yang disediakan KumpulBlogger, yaitu: Iklan Teks dan Iklan Mini Banner. Iklan Teks terdiri dari Tampilan Vertikal (cocok dipasang pada sidebar), Tampilan Horizontal (cocok dipasang di Footer atau halaman content blog), Tampilan Horizontal Judul (cocok dipasang pada footer atau halaman content blog), Tampilan Ifrem Vertikal (cocok dipasang pada sidebar), dan Tampilan Ifrem Horizontal (cocok dipasang pada footer atau halaman content blog). Iklan Mini Banner berupa iklan gambar berukuran 125 x 125 yang tampil vertikal. Iklan ini sangat tepat ditempatkan di sidebar blog. Adapun contoh untuk Iklan Teks dapat anda lihat seperti gambar berikut:

Script Text Advertising untuk Blog anda. Ini untuk mendapatkan Script Iklan Teks yang anda inginkan.

Script Mini Banner untuk Blog anda. Ini untuk mendapatkan Script Iklan Mini Banner yang anda inginkan.

Statistik Revenue. Ini untuk melihat komisi pendapatan anda di KumpulBlogger.

Statistik Revenue dari 3rdParty (Indo.com,kutukutubuku,Smart). Ini untuk melihat komisi pendapatan Indo.com, Kutukutubuku, dan Smart.

Setelah memilih template iklan yang cocok dengan keiinginan anda, klik “Setting Theme Untuk Blog Ini”.

Lihat template iklan yang anda pilih tadi dan lakukan pengaturan warna dan tampilan.

Jika pilihan anda sudah benar, klik tombol “I Choose This”.

Selanjutnya, Copy/paste kode script tersebut pada notepat.

 

Langkah berikutnya

Silahkan login di http://www.blogger.com dengan account blog anda.

Klik Layout/rancangan.

Klik Tambahkan Gadget.

Pilih HTML/JavaScript dan akan terlihat seperti tampilan berikut ini:

• Judul. Isi judul iklan anda, misalnya: Iklan, Sponsor, dan sebagainya.
• Konten. Masukkan script/kode javascrip yang sudah anda dapatkan sebelumnya dari KumpulBlogger.
• Klik tombol Simpan.

Klik tombol Save Arrangement/Simpan pada Loyout anda.

Lihat blog anda. Iklan KumpulBlogger langsung muncul sesuai dengan posisi dimana anda memasangnya.

Cara diatas adalah salah satu cara memasang iklan KumpulBlogger di blog dengan “Tambah Gadget”. Cara lain anda bisa memasangnya di sidebar, bawah judul posting, bawah/akhir posting, footer, dan sebagainya.

Mudahkan caranya. Klik di sini sekarang juga untuk mendaftar gratis di KumpulBlogger. Selanjutnya tinggal anda mencari pengunjung sebanyak-banyaknya dan berharap semoga mereka mengklik iklan di blog Anda. Setiap klik adalah rupiah bagi Anda. Selamat mencoba!

Read More

Cara menambah blog di kumpul blogger.com

Memperoleh penghasilan sendiri merupakan hal yang diimpikan banyak orang. Apalagi jika kita tidak perlu bekerja keras untuk memperoleh penghasilan. Seneng banget gak tuh?hehehe. Hal ini bagi sebagian orang sangat tidak masuk akal. Bagaimana mungkin memperoleh pendapatan namun tidak bekerja keras?? Tapi hal ini bukanlah hal yang mustahil untuk terjadi. Apalagi sekarang jaman sudah sangat berkembang. Salah satu cara untuk mendapatkan penghasilan dengan cara ini yaitu melalui Internet.

Kumpulblogger adalah salah satu program Pay Per Click (PPC) lokal Indonesia yang cukup terkenal dan mampu bersaing dengan PPC lokal lainnya. PPC yang satu ini banyak diminati oleh para blogger termasuk blogger pemula. Target market KumpulBlogger adalah Blogger Indonesia dan Advertiser Lokal, dimana Blogger menyediakan media dan Advertiser memasok pesan komersial di dalam Blog-blog yang terhubung pada jaringan KumpulBlogger. Ini artinya Advertiser (Pemasang Iklan) dapat mempromosikan iklan mereka melalui KumpulBlogger, sedangkan Blogger atau Publisher (Penerbit Iklan) dapat memasang iklan di blog mereka dan akan dibayar setiap iklan yang tayang diklik oleh pengunjung.

Inilah Tutorial Steb By Step nya :


1. Masuk ke kumpulblogger.com

2. Log in seperti biasa
3. Pilih Blogger --> Tambah Blog

Cara Menambah Blog di Kumpul Blogger

- Nama Blog. Isikan nama blog anda, misalnya: “ Hamdan Alam ”.

- Keterangan Tentang Blog. Isi dengan deskripsi blog anda, misalnya: “blog ini bertemakan menyebarkan informasi, ilmu pengetahuan, dan teknologi serta menyediakan juga file-file yang dapat di download gratis”.

- Alamat URL Blog. Masukkan url blog anda, misalnya: “http://jamarisonline.blogspot.com”.

- Category. Isi dengan kategori atau label blog anda, misalnya: “bisnis, internet, software, tutorial, ... ”.

- Tag URL. Isi beberapa kata yang menggambarkan isi blog anda, misalnya: “musik, ebook, komputer, download, tutoral, blog, ... ”.

- Bahasa yang digunakan dalam blog. Pilih bahasa blog anda, misalnya: “English, Indonesia, atau Campuran”.


Setelah semua data diisikan dengan benar, klik Submit untuk melanjutkan.
Jika berhasil akan muncul pesan ”blog berhasil ditambahkan pada account anda, sisipkan kode pada blog anda”.



Sekian Postingan saya kali ini
Semoga Bermanfaat   ^_^

Read More

Cara Membuat Link Download di Blog

Membuat link download tidak ada bedanya dengan cara membuat link biasa seperti yang pernah saya posting sebelumnya. Hanya saja di sini yang harus Anda masukkan ke dalam kode link adalah alamat download dimana Anda telah meng-upload file Anda.
Misalnya Anda telah menyimpan file di tempat pelayanan file sharing seperti 4share atau ziddu.
Setelah Anda upload file maka akan mendapatkan alamat link yang bisa Anda pasang di blog Anda.
Cara memasang link download di blog adalah sebagai berikut:

• Jika Anda ingin memasanng link pada halaman posting pilih entri baru atau new post.
  
• Pastikan ketika posting halaman pilih mode HTML.
  
• Masukkan link yang telah Anda dapat pada keterangan yang berwarna merah di bawah ini:
  
  <a href="http://alamat_download_Anda.html"target="_blank">DOWNLOAD</a>
  

Jika Anda menginginkan keterangan Download diganti dengan gambar, Anda tinggal mengganti kata download dengan menggunakan alamat gambar Anda.

Caranya seperti contoh di bawah ini:

• Ganti yang berwarna hijau dengan alamat gambar Anda.
  
  <a href="http://alamat_download_Anda.html"target="_blank"><img src="http://alamat_gambar_Anda.jpg"></a>
  
  
• Warna merah untuk alamat download Anda.
  
• Warna hijau untuk alamat gambar Anda.

Semoga bermanfaat.

Source : http://www.nimbuzzin.com/2013/10/cara-membuat-link-download-di-blog.html

Read More

Cara Mengetahui Skor atau Peringkat SEO Blog

Mengetahui rangking seo pada blog.  Sebagai bloger pemula saya sempat mempelajari mengenai seo. Walaupun sebenarnya penerapan seo pada blog saya ini belum sepenuhnya optimal.  Kemarin sempat blog walking tentang cara meningkatkan seo, eh malah ketemu website yang dapat mengecek tingkat seo pada blog. Alih alih ngecek seo blog ane, eh ternyata skornya sungguh sangat memilukan heheh cuman dapat skor 70+%. Ya sedikit demi sedikit di perbaiki dan sekarang hasilnya udah dapat 100%.

Untuk mengecek rangking seo pada blog sobat, sobat dapat mengunjungi web seo tools http://chkme.com/page-seo-tools dan masukkan alamat url blog kemudian klik check. Tunggu beberapa saat sampai pengecekan selesai dan menampilkan skor seo blog sobat.

Jika hasilnya kurang memuaskan cobalah mengikuti pandungan yang diberikan di web tersebut. Mulai dari penggunaan tag h1, h2 pada heading atau judul blog, pemasangan deskripsi dan keyword blog, penggunaan deskripsi pada gambar dan lain sebagainya. Jika sudah memperbaiki kekurangan-kekurangan yang ada, cobalah kembali cek ranking seo sobat.

Dari hasil seo blog saya sebelumnya, ternyata penggunaan deskripsi dan keyword blog juga sangat berpengaruh pada skor seo ini. Selain itu gambar edit yang merupakan bawaan bloger juga mempengaruhi skor seo karena tidak memiliki title dan deskripsi.

Cara ini merupakan salah satu cara meningkatkan seo pada kode-kode html yang ada pada template blog. Jika mengalami kendala dalam memperbaiki rangking seo , sobat dapat mencari template blog yang seo friendly sama om google, udah banyak kok template seo yang tersedia di internet. Dan jangan lupa jika sudah memiliki template yang seo , pengoptimalan dalam penulisan artikel juga sangat berguna untuk  menambah tingkat seo pada blog.

Apabila hasilnya sudah memuaskan sobat dapat menempatkan skor seo sobat dengan mengcopy code hasil skor ke dalam blog dan tempatkan di widget, ya itung-itung sebagai motivasilah hehe

Sumber : http://freezon88.blogspot.com/2013/12/cara-mengetahui-peringkat-seo-blog.html#more

Selamat mencoba

Read More

Cara Memasang Iklan Amazon di Blog

Cara pasang iklan amazon di blog. Tidak sulit dulunya saya juga kesulitan,tapi namanya juga ilmu. Pasti awalnya sulit,tapi lama-lama juga gampang. Karena terbiasa.

Ikuti langkah-langkah di bawah :

1. Login dulu ke amazon. Kalau belum punya account registasi di sini
2. Kemudian klik Widget
3. Pilih dengan bijak widget yang ingin kamu pasang. Saya rekomendasikan RECOMMENDED PRODUCT LINKS.
4. Klik add to your web page
5. Disana kita diminta memasukkan Product yang ingin kita jualkan. Ambil contoh Music instrument dengan keyword Gibson
6. Klik Continue
7. Kita di hadapkan pada ukuran. Pilih yang sesuai dengan Blog mu. Terlebih sesuaikan dengan tempat pemasangannya. Jika sudah cocok silahkan klik Select this size
8. Di sini, kita masih bisa mengganti item yang ingin kita jual. Dengan cara Klik Change link content dan masukan keywordnya. kemudian klik Update HTML
9. Setelah dirasa sesuai, klik highlight HTML. Copy Html itu.
10. Kemudian kembali ke Blog.
11. Paste di posting maupun di gadgetmu.
12. Selamat berjualan.

 Semoga jualanya laku sahabat bloger :D heheh saya doakan ....

Read More

Cara Pasang Video Youtube di Blog

Mungkin Anda menyimpan video di youtube dan ingin berbagi dengan orang lain melalui blog yang Anda punya. Karena ini baru pertama kali Anda ingin berbagi video lewat blog, kemungkinan Anda menemukan sedikit kesuliatan tentang bagaimana cara memasang video youtube di blog Anda.
Untuk itu di sini saya ingin berbagi dengan Anda bagaimana cara menambahkan video youtube pada blog.
Tentunya pertama yang harus Anda lakukan adalah upload terlebih dahulu video yang ingin Anda pasang di blog. Cara upload video di youtube dengan mudah bisa Anda lihat pada posting saya sebelumnya.

Jika Anda sudah melakukan upload video lewat youtube maka Anda bisa ikuti cara pasang video di blog di bawah ini:

• Buka video yang ingin Anda share lewat blog.
  Lihat pada bawah video dan pilih share kemudian langkah selanjutnya pilih embed dan copy embed kodenya seperti yang terlihat pada gambar di bawah.

Setelah Anda mengikuti langkah-langkah di atas maka sekarang yang harus Anda lakukan adalah masuk ke blog Anda.

• Pilih blog yang ingin Anda pasang video youtube.
  Sekarang Anda tinggal menentukan di mana Anda akan menaruh videonya. Anda bisa pasang pada halaman posting atau bisa juga Anda letakkan pada sidebar blog.

Cara menambahkan ke halaman posting:

• Lakukan cara posting artikel di blog seperti biasa, kemudian copy dan paste kode link embednya pada posting halaman.
  Yang perlu di ingat ketika melakukan posting halaman pilih posisi HTML seperti terlihat pada gambar di bawah.
  

Cara memasang pada sidebar:

• Pilih layout (tata letak)
  
• Pilih Add a gadget (tambahkan gadget).
  
• Pilih edit HTML/java script.
  
• Copy dan paste kode embednya.
  
• Untuk menyesuaikan dengan lebar sedebar Anda, ukuran width dan height embed kodenya bisa Anda edit terlebih dahulu
  
• Kemudian save.
  

Semoga bermanfaat

Sumber : http://www.nimbuzzin.com/2013/08/cara-pasang-video-youtube-di-blog.html

Read More

Submit Sitemap Blog ke search Engine Google

Sitemap, Peta Situs

Salah satu cara agar blog dapat terindex dengan baik oleh google yaitu dengan cara mengirimkan sitemap atau peta situs ke google melalui webmaster tools. Untuk mengirimkannya terlebih dahulu login ke situs webmaster tools dan daftarkan blog anda dengan mengklik tombol tambahkan situs dan masukkan alamat situs anda. Jika sudah mendaftarkan blog anda, selanjutnya selesaikan tahap verifikasi dengan mengikuti salah satu cara verifikasi tertera. Disini saya menggunakan metode alternatif verifikasi dengan menambahkan tag meta kedalam blog.



Jika sudah melakukan verifikasi blog, maka alamat blog kita akan masuk didalam daftar webmaster tools. Klik alamat blog yang baru diverifikasi kemudian pada tampilan dasbor situs, klik sitemap atau peta situs. selanjutnya klik tombol Tambahkan/Uji Peta Situs. Untuk pengguna blogspot alamat peta situs adalah feeds/posts/default?orderby=updated, masukkan alamat tersebut dan lakukan pengujian terlebih dahulu, jika pengujian berhasil masukkan kembali alamat sitemap blogspot feeds/posts/default?orderby=updated
dan klik tombol mengirim peta situs.

Sitemap atau peta situs yang sudah terkirim akan diproses oleh search engine google, mungkin butuh beberapa hari agar sitemap atau peta situs yang dikirimkan terindex semua oleh google.

 

Sumber : http://freezon88.blogspot.com/2013/07/submit-sitemap-bloger-ke-search-engine.html#more

Read More

cara menambahkan widget Alexa Rank pada blog

Alexa rank merupakan salah satu situs yang memberikan peringkat kepada situs-situs web ataupun blog di internet, jadi untuk mengetahui berapa peringkat sebuah blog atau website kita dapat melihatnnya di website alexa.com. Selain itu alexa juga menyediakan peringkat sebuah website secara internasional dan secara nasional sesuai dengan negara blog atau situs tersebut.


Agar kita dapat mengetahui secara jelas berapa peringkat alexa pada situs ataupun blog kita, kita dapat menambahkan widget alexa kedalam blog. Ini berguna juga sebagai motivasi untuk selalu berusaha menaikkan ranking blog kita menjadi sekecil mungkin yang artinya makin kecil ranking yang kita miliki di alexa rank berarti makin banyak pengunjung situs kita.

Memasang widget alexa rank pada blog kita harus terdaftar dalam web alexa, Bagi yang belum punya akun di alexa dapat klik disini. selanjutnya klik link dan masukkan alamat blog kita lalu klik tombol "build widget" nah sekarang tinggal copy code widget, ada beberapa model widget alexa rank, namun copy salah satu code widget yang sesuai dengan keinginan saja. setelah itu masuk ke dalam blogger - tataletak kemudian add gadget dan paste code alexa kemudian save. tentukan letak gadget alexa sesuai dengan keinginan.

 

Sumber : http://freezon88.blogspot.com/2013/07/cara-menambahkan-widget-alexa-rank-pada.html#more

Read More

Cara merubah atau menghapus menu bawaan template blogger

Kali ini saya akan share sedikit tentang bagaimana mengganti , menghapus atau merubah menu pada template blogger. Mungkin sebagian blogger sudah tau cara ini, tapi bagi pemula hal ini mungkin agak sedikit kurang dipahami.

Sebelumnya download template blogger di btemplates.com, situs penyedia template blogger. Pada situs itu terdapat beberapa template blogger dengan berbagai variasi. Terapkan pada blog anda dan lihat apakah ada menu-menu bawaaan dari template tersebut. Jika ada, kita dapat merubahnya sendiri dan disesuaikan dengan menu dari blog kita.

Sebagai contoh berikut menu standar template yang saya download dan akan saya ganti sesuai dengan menu pada blog saya.

pada gambar disamping terdapat menu bawaan template yang saya gunakanan. namun saya ingin menghapus sebagian menu yang tidak sesuai dengan blog saya.

pertama-tama masuk pada blogger dan pilih menu template lalu klik edit html seperti gambar dibawah ini 

kemudian tekan Ctrl + F untuk mengaktifkan search pada file xml, masukkan nama menu yang ingin dihapus atau dirubah, dibawah ini saya ingin menghilangkan menu business pada menu template saya

untuk menghilangkannya dapat dengan menghapus menu business yang ditandai pada angka 2 sampai angka 3, tapi contoh diatas saya hanya menambahkan code <!-- pada awal code menu business dan --> pada akhir code, fungsinya yaitu agar kode li pada menu business hanya terbaca sebagai comment di browser sehingga tidak tampil pada browser.

sedangkan untuk merubah menu tersebut, cukup dengan merubah kata business sesuai dengan menu yang diinginkan namun jangan lupa untuk memasukkan alamat url menu baru dengan cara memasukkan link menu pada href='masukkan-link-menu-disini'.

nah sampai disini kita sudah dapat merubah menu template yang kita download sesuai dengan keinginan :) semoga membantu

 

Sumber : http://freezon88.blogspot.com/2013/09/cara-merubah-atau-menghapus-menu-bawaan.html#more

Read More

Membuat efek Berputar pada Icon atau Logo Blog

Tutorial cara membuat logo atau icon berputar pada blog dengan menggunakan css3 – Pada kesempatan kali ini saya akan membahas tentang bagaimana membuat efek berputar pada icon atau logo blog. Sebagai contoh saya akan membuat icon social media berputar yang ada pada blog. Ketika mouse berada diatas icon tersebut, maka icon tersebut akan berputar 360 derajat. Yah lumayan untuk mempercantik tampilan blog kita sehingga nyaman dilihat. Untuk melihat contohnya silahkan tempatkan mouse anda berada diatas icon social media yang ada pada blog freezon.

Untuk melakukannya kita cukup menambahkan icon css transition pada properti tag atau selector css social media tersebut dengan cara mencari tag social media yang ada pada template blog kita. Pertama-tama masuk ke akun bloger anda kemudian pilih menu template dan klik edit html. Tekan CTRL + F untuk mencari tag css social media tersebut. Contoh code css  social media yang ada pada template blog saya :

CLASS CSS ICON SOCIAL MEDIA :

Code css Sebelum dipasangkan efek berputar pada icon :

.social-profiles-widget img { margin:0 4px 0 0; }

Kemudian tambahkan code css3 untuk efek berputar pada image sehingga Nampak seperti contoh dibawah ini

Code css Sesudah dipasangkan efek berputar pada icon :

margin:0 4px 0 0; transition:all 0.8s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; }

CLASS CSS ICON SOCIAL MEDIA KETIKA MOUSE BERADA DIATASNYA

Code css Sebelum dipasangkan efek berputar pada icon :

.social-profiles-widget img:hover { opacity:0.8; }

Code css Sesudah dipasangkan efek berputar pada icon :

.social-profiles-widget img:hover { opacity:0.8; transform:rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg);-ms-transform: rotate(360deg); }

Jika anda sudah menambahkan code diatas, tinggal melakukan penyimpanan. Refresh browser anda dan coba tempatkan mouse pada icon social media yang ada pada blog dan lihat hasilnya. Jika tidak terjadi efek berputar berarti ada kesalahan pemasangan code css pada tag social media. Pastikan agar tag yang dipasangkan efek berputar merupakan tag css dari icon social media tersebut.

 

Sumber : http://freezon88.blogspot.com/2013/10/membuat-efek-berputar-pada-icon-atau.html#more

Read More

Cara Memasang Comment facebook Pada Postingan Blogger

Cara membuat kotak komentar facebook di blogger – kali ini saya akan membahas bagaimana cara menambahkan komentar facebook pada postingan di blogger. Komentar facebook pada postingan ini sebenarnya agar mempermudah pengunjung memberikan komentar pada postingan blog kita. Karena rata-rata pengguna internet sudah memiliki account facebook.

Selain mempermudah pengunjung untuk memberikan komentar, kotak komentar juga ini dapat menambahkan traffic pada blog yang berasal dari facebook, dimana di ketahui pengguna facebook sudah sangat banyak.

Saya pernah mencari referensi di google tentang bagaimana cara menambahkan kotak komentar facebook pada tiap postingan blog, namun saya merasa kesulitan dalam penerapannya walaupun pada akhirnya selesai juga. Oke dari pada banyak basa basi mendingan kita langsung saja mulai langkah langkahnya J sebagai contoh lihat gambar dibawah, saya memasang kotak komentar facebook tepat diatas kotak komentar standar bloger

jika sobat ingin membuat komentar facebook yang berdampingan dengan komentar blog seperti yang ane gunakan di blog ini dapat lihat tutorialnya disini

Masuk ke akun bloger anda, kemudian klik blog yang akan dipasangkan kotak komentar facebook. Pilih menu template dan klik edit html. Karena disini saya memasang kotak komentar facebook tepat diatas kotak komentar bloger dan dibawah postingan, maka saya akan menempatkan code comment facebook tepat ditengah-tengah antara postingan blog dan komentar standar blog, caranya tekan CTRL + F kemudian ketikan <data:post.body/>. Kita akan menemukan beberapa tag <data:post.body/> namun di template saya, saya mencari tag <data:post.body/> yang paling bawah, nah pada awalnya disini saya selalu gagal dalam penempatan code comment facebook hingga akhirnya saya memilih tag <data:post.body/> yang berada paling bawah. Awalnya saya menempatkan codenya pas dibawah tag <data:post.body/> namun tampilan kotak komentar facebook berada diatas  artikel terkait dan tombol share button (lihat no 1 pada gambar dibawah). Yang saya inginkan adalah komentar facebook tersebut tepat diatas komentar standar bloger, sehingga tampilannya lebih menarik (no 3 pada gambar)

Nah agar tampilan komentar facebook berada di no 3 contoh gambar diatas, saya menempatkan code comment facebook dibawah tag <data:post.body/> tapi lebih tepatnya diatas code komentar standar bloger, copy code comment facebook dibawah ini 
<!--Comment FB--> <b:if cond='data:blog.pageType == "item"'> <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/> <div> <fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' num_posts='1' width='450'/></div> </b:if> <!--End of Comment FB-->
lihat contoh gambar dibawah ini

Pada gambar yang diatas angka 1 menunjukan no 4 pada gambar pertama yang diatas yaitu home dan older post, jadi saya menempatkan code commentar facebook  tepat dibawah no 1 yaitu pada no 2. Sehingga kotak komentar facebook tepat berada antara navigasi home older post dan komentar standar bloger.

Contoh diatas merupakan contoh pada template blog saya , tetapi mudah-mudahan bisa menjadi referensi bagi sobat bloger untuk menambahkan komentar facebook pada postingan artikel. Pada saat saya mencoba cara diatas, sebenarnya saya sempat mengalami beberapa kegagalan, namun saya mencoba memindahkan code facebook comment diatas sehingga pas diatas komentar standar bloger.

Sumber :  http://freezon88.blogspot.com/2013/10/memasang-comment-facebook-pada.html#more

Selamat mencoba CMIIW 

Read More

Cara mudah modifikasi tema blog atau web dengan menggunakan firebug

Belajar modifikasi tema template blog. Kali ini saya akan share sebuah addson browser yang berfungsi untuk membantu kita dalam modifikasi tampilan blog. Kadang beberapa tema blog yang kita gunakan ada sedikit yang tidak sesuai dengan keinginan kita. Dan ketika merubahnya langsung dari dasbor bloger kita harus melakukan penyimpanan untuk melihat hasil modifikasi tersebut pada blog.

Dengan menggunakan add ons firebug yang ada pada browser, kita dapat langsung melihat hasil dari modifikasi tampilan blog tanpa harus menyimpannya terlebih dahulu. Keuntungan menggunakan add ons ini adalah kita tidak perlu takut akan tampilan blog yang salah di modifikasi karena pada saat menggunakan add ons ini code hasil modifikasi belum tersimpan dalam blog sebelum kita melakukan penyimpanan terlebih dahulu. Ketika menggunakan firebug setiap code css yang kita rubah, akan langsung dilihat hasilnya pada browser.

Menginstal firebug pada browser sama halnya dengan caramenginstal add ons wappalyzer yang pernah saya bahas, jadi saya akan bahas cara penggunaannya saja. Untuk menggunakan firebug cukup dengan klik icon firebug yang ada pada browser sampai muncul jendela firebug pada bagian bawah browser seperti contoh dibawah :

Ketika jendele firebug telah muncul klik icon inspect no 1 pada gambar diatas, lalu klik bagian template yang akan di modifikasi. Sebagai contoh saya akan merubah Judul blog saya yang sebelumnya berwarna putih menjadi warna merah. Ketika kita klik judul blog makan akan muncul file code css disebelah kanan yang menunjukan style dari judul blog (no 3).

Pada gambar diatas setelah kita klik judul blog, selanjutnya kita klik tag <a href…….. </a> (no 1) dan perhatikan disebelah kanan yang saya tandai dengan angka 2, terdapat code css yang menunjukan style dari h1 atau judul blog. Disitu dilihat bahwa color warna dari header h1 sudah saya ganti menjadi #ff0000 (warna merah) yang sebelumnya adalah #ffffff (warna putih).

Dari contoh diatas penggunaan firebug sangatlah mudah, sehingga jika kita sudah yakin akan style yang kita terapkan tadi kita dapat langsung menggantinya di menu edit html pada blog. Sebaiknya kita juga harus paham sedikit tentang bahasa pemograman css dan html sehingga sangat mudah dalam mendesain sendiri 

tampilan blog kita.

Sumber : http://freezon88.blogspot.com/2013/10/Cara-mudah-modifikasi-tema-template-blog-atau-web.html#more

Read More

Cara Mengganti atau Memasang favicom pada blog

Cara mengganti favicon di blog. Logo favicon standar pada blog yang kita buat dibloger adalah dengan menggunakan logo bloger, nah bagaimana caranya agar logo favicon tersebut kita ganti dengan logo blog kita sendiri agar kelihatan lebih keren hehe. Coba ikuti langkah-langkah yang akan saya jabarkan dibawah ini.

Sebelumnya buatlah terlebih dahulu logo favicon yang diinginkan dapat berupa format jpeg atau format png. Setelah membuat logo tersebut, kunjungi website layanan untuk menggenerate logo agar menjadi favicon contohnya pada web favicon generator

Pada contoh gambar diatas, klik pilih file kemudian pilih logo yang telah dibuat, disini saya membuat logo blog saya dengan format .png. klik create favicon untuk membuat icon favicon dengan secara otomatis icon favicon akan dibuat dengan ukuran 16x16 pixel.

Selanjutnya klik download the generator favicon untuk mendownload favicon yang telah dibuat.

Untuk menerapkanya di blog, ada dua cara, yaitu langsung pada menu layout yang ada di dasbor atau dengan memasang code html baru untuk favicon pada menu template edit html.

Cara pertama masuk pada dasbor bloger sobat, kemudian pilih menu layout kemudian klik edit pada favicon dan upload favicon yang telah di download tadi kemudian save. kemudian lakukan refresh pada blog dan lihat hasilnya.

Jika cara ini masih belum berhasil, selanjutnya gunakan cara kedua yaitu dengan menambahkan code html untuk membuat favicon. Masuk pada dasbor bloger anda, kemudian pilih menu template dan edit html. Cari code dibawah dengan menggunakan CTRL + F jika tidak ada, copy code dibawah dan tempatkan di bawah tag <head> ataupun di atas tag </head>

<link href=’URL-FAVICON' rel='shortcut icon' type='image/vnd.microsoft.icon'/>

Ganti code merah dengan alamat ulr favicon blog anda, save dan coba lakukan refresh pada blog.

Mungkin bagi pemula bingung dan bertanya dimana kita mendapatkan alamat url favicon blog, untuk mendapatkan alamat url favicon pada blog, kita harus mengupload favicon tersebut kesalah satu website penyedia upload foto, seperti photo bucket atau web-web lain yang sekarang sudah banyak di internet. Namun kita juga bisa upload favicon ke dalam blog pada saat kita membuat sebuah artikel. Nah pada saat di upluad kita tidak perlu menempatkannya pada artikel namun kita hanya mengambil alamat url favicon tersebut yang telah di upload, sebagai contoh lihat gambar dibawah :

Klik kanan pada favicon yang telah di upload dan pilih salin url gambar, nah kemudian paste url gambar tersebut kedalam code html yang berwarna merah seperti contoh diatas.

 

Sumber : http://freezon88.blogspot.com/2013/10/cara-memasang-favicon-pada-blog.html#more

Semoga membantu 

Read More

Cara Memasang Breadcrumb di Blog

Tutorial memasang breadcrumb di blog.  Salah satu cara meningkatkan seo pada blog adalah dengan menambahkan fitur breadcrumb pada blog, inilah yang saya temui ketika mencari salah satu cara untuk meningkatkan SEO. Yah akhirnya saya juga memasang fungsi ini pada blog saya. Menurut beberapa sumber fitur ini membantu artikel agar mudah terindex oleh mesin pencari. Namun ada juga yang mengatakan bahwa fungsi ini tidak cocok untuk SEO. Nah ini terserah dari sobat, mau memasang fungsi ini atau tidak.

Setelah saya memasang fungsi ini, ketika melakukan search pada om google, ternyata fungsi ini terlihat juga pada search engine, seperti contoh gambar diatas beberapa artikel saya yang tampil di search engine google terdapat breadcrumb.

Breadcrumb merupakan link –link label yang menuju pada artikel yang dibuat. Berikut contoh tampilan breadcrumb pada blog

Home>>office>>excel>>belajar ms excel

Untuk memasang breadcrumb masuk ke dasbor blog anda, kemudian pilih menu template dan klik edit template. Pertama-tama masukkan style dari breadcrumb cari kata ]]></b:skin> kemudian copy style dibawah ini dan tempatkan diatasnya

.breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 13px 0px; font-size:100%; line-height: 1.4em; border-bottom:3px double #eee;}

Setelah itu cari code berikut <b:includable id='main' var='top'> dan gantikan dengan code dibawah ini 

<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'> <b:if cond='data:blog.pageType == "static_page"'> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div> <b:else/> <b:if cond='data:blog.pageType == "item"'> <!-- breadcrumb for the post page --> <b:loop values='data:posts' var='post'> <b:if cond='data:post.labels'> <div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'> <span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span> <b:loop values='data:post.labels' var='label'> » <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span> </b:loop> » <span><data:post.title/></span> </div> <b:else/> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div> </b:if> </b:loop> <b:else/> <b:if cond='data:blog.pageType == "archive"'> <!-- breadcrumb for the label archive page and search pages.. --> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span> </div> <b:else/> <b:if cond='data:blog.pageType == "index"'> <div class='breadcrumbs'> <b:if cond='data:blog.pageName == ""'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span> <b:else/> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span> </b:if> </div> </b:if> </b:if> </b:if> </b:if> </b:if> </b:includable> <b:includable id='main' var='top'> <b:include data='posts' name='breadcrumb'/>

Save template dan lihatlah hasilnya pada google, jika belum muncul cobalah menunggu untuk beberapa hari. Menurut ane fungsi ini tidak langsung tampil di google pada saat kita memasangnya, butuh waktu agar breadcrumb muncul di search engine.

Sumber : http://freezon88.blogspot.com/2013/11/cara-memasang-breadcrumb-di-blog.html#more

selamat mencoba :)

Read More

Cara Membuat Komentar Facebook dan blogger dengan model tab

Membuat komentar facebook dan komentar blog dengan model tab. Pada artikel yang lalu saya sudah membuat cara memasang komentar facebook pada bloger namun dengan style yang berbeda.  Nah kali ini akan saya akan membahas membuat komentar facebook yang berdampingan dengan komentar blogger dengan model atau style tab. Seperti yang saya gunakan pada blog ini. Penggunaan model tab ini biasa digunakan pada sidebar blog seperti pada tampilan tab label, artikel populer dan archive.

Cara membuatnya hampir sama cara membuat kotak komentar facebook yang saya bahas dulu. Pertama-tama masuk keakun blogger pilih template dan klik edit html. Cari code html berikut dengan menggunakan CTRL + F

<div class='comments' id='comments'>

Lalu copy code dibawah ini dan tempatkan tepat dibawah code html diatas

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'> <img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/><fb:comments-count expr:href='data:post.url'/> Comments</div> <div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'> <img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments</div> <div class='clear'/> </div> <div class='comments-page' id='fb-comments-page'> <b:if cond='data:blog.pageType == "item"'><div id='fb-root'/> <fb:comments expr:href='data:post.url' num_posts='2' width='550'/></b:if></div> <div class='comments comments-page' id='blogger-comments-page'> <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='IDFANPAGEFACEBOOK' property='fb:admins'/><script type='text/javascript'>function commentToggle(selectTab) {$(".comments-tab").addClass("inactive-select-tab");$(selectTab).removeClass("inactive-select-tab");$(".comments-page").hide();$(selectTab + "-page").show();}</script> <style>.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}</style>

Jika sobat mempunyai fan page facebook cari kata IDFANPAGEFACEBOOK pada code diatas dan ganti dengan id fan page facebook anda.

Save template dan refresh blog anda. Jika komentar facebook belum muncul coba cari kembali tag <div class='comments' id='comments'> dan tempatkan lagi code komentar facebook dibawah tag tersebut. Karena pada saat saya memasang komentar facebook dengan model tab ini saya menemukan dua tag html tersebut dan kedua-duanya saya tempatkan code komentar facebook.

 

Sumber : http://freezon88.blogspot.com/2013/12/komentar-facebook-dan-blog-model-tab.html#more

Selamat mencoba

Read More

Cara Menampilkan Widget di halaman tertentu pada blog

Widget yang terlalu banyak biasanya hanya akan memperburuk tampilan blog sendiri. Agar widget yang dipasang di blog lebih fleksibel kita bisa membuat widget tersebut muncul di halaman tertentu saja. Seperti menampilkan widget di halaman depan atau menampilkannya pada postingan tertentu.


Menampilkan widget pada halaman tertentu kita tinggal menambahkan conditional tags pada code html widget, namun harus sesuai dengan id widget tersebut. ID widget pada blog biasanya bertuliskan HTML1, HTML2, HTML3 dll. Tapi bagaimana cara mengetahui id sebuah widget? Ada beberapa cara yang bisa gunakan untuk mengetahui id sebuah widget. Cara yang biasa saya gunakan adalah dengan menggunakan add ons firebug. Dengan menggunakan firebug widget yang kita klik akan muncul id hmtlnya di jendela firebug seperti contoh diatas. Jika belum paham mengenai penggunaan firebug dapat mengikuti tutorialnya disini.

Atau dapat menggunakan cara yang paling mudah mengetahui id widget pada blog yaitu dengan hanya menempatkan cursor diatas icon edit widget tersebut. Sehingga akan muncul link di bagian bawah browser yang menampikan link ke widget tersebut. Pada link tersebut terdapat id widget. Perhatikan contoh dibawah ini :

Setelah mengetahui id widget yang ingin ditampilkan di halaman tertentu, kita akan mencari id widget tersebut di blog kita dengan cara masuk kea kun blog pilih template dan klik edit html. Tekan CTRL+F untuk mencari id widget seperti contoh saya disini menggunakan widget feedjit dengan id widgetnya HTML8 pada blog saya. Jika sudah menemukan code id widget seperti contoh dibawah ini.

</b:includable><br />           </b:widget><br />           <b:widget id='HTML8' locked='false' title='' type='HTML'><br />             <b:includable id='main'><br />   <!-- only display title if it's non-empty --><br />   <b:if cond='data:title != ""'><br />     <h4 class='title'> <data:title/></h4> <br />   </b:if><br />   <div class='widget-content'> <br />     <data:content/><br />   </div> <br />   <!--<b:include name='quickedit'/>--><br /> </b:includable><br />

Kemudian tambahkan conditional tag <b:if cond='data:blog.url == data:blog.homepageUrl'> dibawah code <b:includable id='main'> dan tag penutupnya </b:if> sebelum code </b:includable>. Sehingga menjadi seperti contoh dibawah ini

</b:includable>

          </b:widget>

          <b:widget id='HTML8' locked='false' title='' type='HTML'>

            <b:includable id='main'>

<b:if cond='data:blog.url == data:blog.homepageUrl'>

  <!-- only display title if it's non-empty -->

  <b:if cond='data:title != &quot;&quot;'>

    <h4 class='title'><data:title/></h4>

  </b:if>

  <div class='widget-content'>

    <data:content/>

  </div>

  <!--<b:include name='quickedit'/>-->

</b:if>

</b:includable>

Code <b:if cond='data:blog.url == data:blog.homepageUrl'> berfungsi menampilkan widget di halaman depan atau homepage blog. Untuk menampilkannya di halaman postingan saja, atau tepatnya dihalaman artikel tinggal merubah code conditional tagnya sedangkan code penutupnya tidak perlu dirubah seperti contoh dibawah ini :

Menampilkan widget dihalaman depan (halaman utama Homepage)
<b:if cond='data:blog.url == data:blog.homepageUrl'>

Menampilkan widget dihalaman artikel atau postingan
<b:if cond='data:blog.pageType == "item"'>

Menampilkan widget dihalaman archive
<b:if cond='data:blog.pageType == "archive"'>

Menampilkan widget hanya di halaman tertentu atau artikel tertentu
<b:if cond='data:blog.url == "alamat url terntu"'>

Menampilkan widget dihalaman Statis
<b:if cond='data:blog.pageType != "static_page"'>

Save template dan refresh blog. Kemudian lihat hasilnya.

So jika ingin menggunakannya pada widget yang lainnya, cukup dengan cara mencari id widget tersebut dan ikuti cara diatas.


Sumber : http://freezon88.blogspot.com/2013/12/cara-menampilkan-widget-di-halaman.html#more

Selamat mencoba

Read More

Cara Mengetahui Skor atau Peringkat SEO Blog

Mengetahui rangking seo pada blog.  Sebagai bloger pemula saya sempat mempelajari mengenai seo. Walaupun sebenarnya penerapan seo pada blog saya ini belum sepenuhnya optimal.  Kemarin sempat blog walking tentang cara meningkatkan seo, eh malah ketemu website yang dapat mengecek tingkat seo pada blog. Alih alih ngecek seo blog ane, eh ternyata skornya sungguh sangat memilukan heheh cuman dapat skor 70+%. Ya sedikit demi sedikit di perbaiki dan sekarang hasilnya udah dapat 100%.

Untuk mengecek rangking seo pada blog sobat, sobat dapat mengunjungi web seo tools http://chkme.com/page-seo-tools dan masukkan alamat url blog kemudian klik check. Tunggu beberapa saat sampai pengecekan selesai dan menampilkan skor seo blog sobat.

Jika hasilnya kurang memuaskan cobalah mengikuti pandungan yang diberikan di web tersebut. Mulai dari penggunaan tag h1, h2 pada heading atau judul blog, pemasangan deskripsi dan keyword blog, penggunaan deskripsi pada gambar dan lain sebagainya. Jika sudah memperbaiki kekurangan-kekurangan yang ada, cobalah kembali cek ranking seo sobat.

Dari hasil seo blog saya sebelumnya, ternyata penggunaan deskripsi dan keyword blog juga sangat berpengaruh pada skor seo ini. Selain itu gambar edit yang merupakan bawaan bloger juga mempengaruhi skor seo karena tidak memiliki title dan deskripsi.

Cara ini merupakan salah satu cara meningkatkan seo pada kode-kode html yang ada pada template blog. Jika mengalami kendala dalam memperbaiki rangking seo , sobat dapat mencari template blog yang seo friendly sama om google, udah banyak kok template seo yang tersedia di internet. Dan jangan lupa jika sudah memiliki template yang seo , pengoptimalan dalam penulisan artikel juga sangat berguna untuk  menambah tingkat seo pada blog.

Apabila hasilnya sudah memuaskan sobat dapat menempatkan skor seo sobat dengan mengcopy code hasil skor ke dalam blog dan tempatkan di widget, ya itung-itung sebagai motivasilah hehe

 

Sumber : http://freezon88.blogspot.com/2013/12/cara-mengetahui-peringkat-seo-blog.html#more

Selamat mencoba

Read More

Memasang Meta Tag Deskripsi dan keyword di Blog

Cara memasang deskripsi dan keyword blog  untuk optimasi SEO.  Nah pada artikel yang lalu saya menjelaskan tentang bagaimana mengecek ranking SEO pada blog. Ketika melakukan pengecekan deskripsi dan keyword merupakan hal sangat berpengaruh, sehingga jika tidak memasang salah satu dari itu akan sangat menurunkan peringkat seo blog. Hal itupun terjadi ketika saya mengecek rangking seo blog ini dan ternyata hasilnya sangat mengecewakan heheh. Tapi setelah ditambah deskripsi dan keyword lumayanlah peningkatannya :D.

Langsung saja ya, untuk memasang descripsi dan keyword pada blog kita menggunakan meta tag. Bingung dengan apa itu meta tag heheh ni baca penjelasan dari Wikipedia tentang meta tag “Meta adalah elemen atau tag dalam bahasa pemrograman HTML atau XHTML yang berfungsi sebagai penyampai informasi metadata dari sebuah halaman web. Elemen meta ini harus diletakkan pada bagian “head” dalam HTML tersebut. Tag meta ini dapat dipakai juga untuk menyatakan deskripsi/keterangan dari suatu halaman web dan untuk menjelaskan mengenai kata kunci (keyword) yang terkait serta untuk metadata lain tanpa “head”. Secara umum, terdapat beberapa macam meta tag dengan fungsi yang berbeda. Beberapa fungsi tersebut misalnya meta keywords dan description”.

Untuk memasang deskripsi dan keyword masuk ke dasbor blog – template – edit html, kemudian copy code dibawah ini dan tempatkan diantara tag <head> dan </head>. Terserah mau ditempati diatas </head> atau tepat dibawah <head> yang penting diantara kedua tag tersebut :D

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<meta content='Blog yang membahas tentang tutorial internet, drupal, animasi, web, css, blog dan tips dan trik' name='description'/>

<meta content='Tutorial, cara, hotspot, mikrotik, drupal, css, web, website, blog, ms word, ms excel, animasi, membuat, windows, software, download, google, bagaimana, modifikasi, tips dan trik, tips, trik, pengenalan, internet, ' name='keywords'/>

</b:if>

Meta tag dengan name description itulah meta tag untuk deskripsi blog anda dan meta tag dengan name keywords untuk keyword blog.  Ganti code yang berwarna merah tersebut sesuai dengan deskripsi blog anda pada bagian meta content dengan name description dan keyword blog anda  pada tulisan yang berwarna merah pada meta content dengan name keywords. 

 

Sumber : http://freezon88.blogspot.com/2013/12/memasang-meta-tag-deskripsi-dan-keyword.html#more

Selamat mencoba

Read More

Membuat Artikel Terkait atau related Posts di Blog

Membuat artikel terkait atau related post pada blog. Nah satu lagi cara agar blog lebih powerfull yaitu dengan membuat artikel terkait pada akhir postingan blog. Yang dimaksud artikel terkait adalah artikel-artikel yang berkaitan dengan postingan yang muncul dan kaitannya berupa persamaan kategori atau label. Jadi pembuatan artikel terkait ini berdasarkan label pada blog. Ini berguna agar si pengunjung dapat lebih lama mengunjungi blog dengan melihat artikel artikel yang berkaitan.

Pada kesempatan yang berharga ini (ceramah mode on) saya akan membagi tips cara membuat artikel terkait dengan menggunakan logo atau icon yang berbeda, seperti  pada blog ini saya menggunakan icon favicon blog saya . Lebih jelasnya liat gambar diatas. 

Logo atau gambar yang berada disamping judul-judul artikel pada gambar diatas, saya ambil dari link favicon pada blog saya. Jadi kelihatan lebih natural heheh kayak lagunya dmasiv yah.

Langsung saja pada step pertama copy code dibawah ini dan tempatkan diantara tag <head> dan </head>

<!-- Artikel terkait by freezon88.blogspot.com--> <b:if cond='data:blog.pageType == "item"'> <style> #related-posts { float : left; width : auto; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; color:#000000 } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfK_al7alKyR82dFpDbPYevQcIR7ZgvXKCskVWruGgW8NAy1JheXrvnOSbFf82___P1TyY41suqpl25Z2LM5QVhM6zKmlgft_F7Xgx6w-YGMW6h4EuNN07ocUs7o4nGos_hsVgptUy5SQd/h120/favicon.ico") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script type='text/javascript'> //<![CDATA[ var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++;break;}}}} function removeRelatedDuplicates(){var tmp=new Array(0);var tmp2=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length- 1]=relatedUrls[i];tmp2.length+=1;tmp2[tmp2.length- 1]=relatedTitles[i];}} relatedTitles=tmp2;relatedUrls=tmp;} function contains(a,e){for(var j=0;j<a.length;j++)if(a[j]==e)return true;return false;} function printRelatedLabels(){var r=Math.floor((relatedTitles.length- 1)*Math.random());var i=0;document.write('<ul>');while(i<relatedTitles.length&&i<20){document.write(' <li><a href="'+ relatedUrls[r]+'">'+ relatedTitles[r]+'</a></li> ');if(r<relatedTitles.length- 1){r++;}else{r=0;} i++;} document.write('</ul> ');document.write('<a rel="dofollow" href="http://freezon88.blogspot.com/">Cara Membuat Related Post</a> By : FreeZon Blog</font>');} //]]> </script> </b:if> <!--end of artikel terkait -->

Pada code diatas ganti url ini https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfK_al7alKyR82dFpDbPYevQcIR7ZgvXKCskVWruGgW8NAy1JheXrvnOSbFf82___P1TyY41suqpl25Z2LM5QVhM6zKmlgft_F7Xgx6w-YGMW6h4EuNN07ocUs7o4nGos_hsVgptUy5SQd/h120/favicon.ico dengan alamat url favicon atau logo sobat agar gambar yang tampil disamping artikel tersebut adalah logo atau icon milik sobat sendiri. Jika menggunakan logo, gunakanlah logo dengan ukuran yang kecil seperti contoh.

Setelah menempatkan code diatas, sekarang copy code dibawah ini dan tempatkan dibawah  <data:post.body/>. Kalau diblog ini saya tempatkan pas dibawah code ini <b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

<!-- Artikel Terkait--> <b:if cond='data:blog.pageType == "item"'> <div id='related-posts'> <font face='Arial' size='3'><b>Baca Juga : </b> </font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/> <b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=8"' type='text/javascript'/> </b:if></b:loop></font> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script> </div> </b:if> <!--end of artikel terkait-->

Save template dan lihat hasilnya. Selamat mencoba

Sumber : http://freezon88.blogspot.com/2013/12/membuat-artikel-terkait-related-posts-blogspot.html#more

Read More