What's New Here?


Title Blog atau judul blog yang selalu muncul ketika link sebuah blog di klik atau artikel blog diklik adalah sebuah halaman index blog. Pada halaman index blog biasanya yang muncul pada title bar di browser adalah nama dari blog itu sendiri.



Tidak ada masalah memang bila yang muncul pada browser adalah nama blog, jadi artikel yang manapun yang dibuka tetap yang terlihat pada title bar

Title Blog Search Engine Friendly Tips

Posted by rike No comments


Title Blog atau judul blog yang selalu muncul ketika link sebuah blog di klik atau artikel blog diklik adalah sebuah halaman index blog. Pada halaman index blog biasanya yang muncul pada title bar di browser adalah nama dari blog itu sendiri.



Tidak ada masalah memang bila yang muncul pada browser adalah nama blog, jadi artikel yang manapun yang dibuka tetap yang terlihat pada title bar

0 comments:

Kontak Kami
Tidak jarang pengunjung blog ingin mengajukan saran, masukan, atau pertanyaan diluar konteks posting yang kita buat. Bisa pula ada yang ingin memasang iklan, siapa tau... Tentu mereka ingin mengontak sang pemilik blog. Betul tidak? Tapi bagaimana caranya kalau mereka tidak menemukan fasilitas untuk menghubungi pemilik blog. Buka profil, kemudian lihat alamat email, login ke email dia, masukkan alamat email pemilik blog, dan akhirnya "send". Wah, terlalu rumit, bro. Jarang-jarang ada yang seperti itu... Jadi tidak ada salahnya apabila kita sebagai owner blog menyediakan fasilitas "kontak kami" tersebut dalam blog. Manfaatnya agar pengunjung blog dapat dengan mudah mengontak kita, apalagi jika ditambah dengan embel-embel "secret" atau "important". Nah, trik blogger kali ini kita akan mengulas cara memasang kontak kami dengan menggunakan widget EmailMeForm. Ayo, kita kuliti triknya (kaya pisang atau kacang atau hewan sembelihan aja he.. he..)


Berikut step by stepnya untuk membuat kontak kami :

  • Kamu bisa mengindahkan langkah ini, jika kamu merasa tidak perlu yakni membuat posting "Terima Kasih". Hmm... yang seperti apa yah? Contohnya seperti posting "Terima Kasih" ini.

Catatan :

  1. Agar postingan "Terima Kasih" tidak muncul di halaman Beranda/Home (pada saat klik Terbitkan Entri/Publish Post), ubahlah tanggal posting dengan meng-klik "Opsi Entri", lihat sebelah kanan "Tanggal dan jam entri" (dimundurkan tanggal/bulan/tahunnya).

  2. Dan posting ini juga tidak perlu ada komentar (pilih opsi "Komentar Pembaca" dengan "jangan izinkan").



  • Arahkan alamat browser kamu ke EmailMeForm.

  • Apabila kamu belum ada akun di EmailMeForm, klik Signup Now for Free.

  • Setelah selesai ngisi form pendaftaran, tunggu verifikasi email.

  • Kalau udah nongol di email kamu, klik link untuk verifikasi dan kamu akan dibawa kembali ke halaman EmailMeForm.

  • Login dengan akun kamu.

  • Klik Control Panel --> "Create a New Form".

  • Step 1

Web form Name :  Nama yang kamu inginkan, atau biarkan saja (contoh :  Kontak Kami, Contact Us, etc).

Recipients Emails :  Alamat email yang akan menerima pesan.

Thank you page : Alamat halaman web/blog yang berisi ucapan terima kasih. Kalau kamu membuat seperti pada point pertama, maka kamu bisa memasukkan alamat postingannya disini.
  • Next  --> Step 2

Berisi form yang akan diisi oleh pengunjung blog untuk mengontak kita via email, terdiri dari : Your Name, Your Email Address, Subject, dan Message. Bisa kamu rubah atau biarkan sesuai dengan yang ada.
  • Next  --> Step 3

  • Next  --> Step 4

  • Next  --> Step 5

  • Next  --> Step 6



  • Finish

  • Klik "get the HTML Code" --> Copy kode dalam text area di bawah tulisan "Copy and paste this HTML code into your page:" dan paste dalam notepad atau text editor lainnya.

  • Selanjutnya, buat sebuah postingan seperti biasa dan copas kode HTML di notepad ke dalam postingan kamu, contohnya seperti postingan "Kontak Kami" ini.

Catatan :

  1. Agar postingan "Kontak Kami" tidak muncul di halaman Beranda/Home (pada saat klik Terbitkan Entri/Publish Post), ubahlah tanggal posting dengan meng-klik "Opsi Entri", lihat sebelah kanan "Tanggal dan jam entri" (dimundurkan tanggal/bulan/tahunnya).

  2. Dan posting ini juga tidak perlu ada komentar (pilih opsi "Komentar Pembaca" dengan "jangan izinkan").



  • Terbitkan.

  • Terakhir buatlah link ke "Kontak Kami" yang berfungsi untuk memudahkan pengunjung menggunakan fasilitas ini, contoh ; menu navigasi, link di sidebar, dan sebagainya.

Selamat memasang "Kontak Kami" dengan widget EmailMeForm...

Trik Blogger | Widget Kontak Kami dengan EmailMeForm

Posted by rike No comments

Kontak Kami
Tidak jarang pengunjung blog ingin mengajukan saran, masukan, atau pertanyaan diluar konteks posting yang kita buat. Bisa pula ada yang ingin memasang iklan, siapa tau... Tentu mereka ingin mengontak sang pemilik blog. Betul tidak? Tapi bagaimana caranya kalau mereka tidak menemukan fasilitas untuk menghubungi pemilik blog. Buka profil, kemudian lihat alamat email, login ke email dia, masukkan alamat email pemilik blog, dan akhirnya "send". Wah, terlalu rumit, bro. Jarang-jarang ada yang seperti itu... Jadi tidak ada salahnya apabila kita sebagai owner blog menyediakan fasilitas "kontak kami" tersebut dalam blog. Manfaatnya agar pengunjung blog dapat dengan mudah mengontak kita, apalagi jika ditambah dengan embel-embel "secret" atau "important". Nah, trik blogger kali ini kita akan mengulas cara memasang kontak kami dengan menggunakan widget EmailMeForm. Ayo, kita kuliti triknya (kaya pisang atau kacang atau hewan sembelihan aja he.. he..)


Berikut step by stepnya untuk membuat kontak kami :

  • Kamu bisa mengindahkan langkah ini, jika kamu merasa tidak perlu yakni membuat posting "Terima Kasih". Hmm... yang seperti apa yah? Contohnya seperti posting "Terima Kasih" ini.

Catatan :

  1. Agar postingan "Terima Kasih" tidak muncul di halaman Beranda/Home (pada saat klik Terbitkan Entri/Publish Post), ubahlah tanggal posting dengan meng-klik "Opsi Entri", lihat sebelah kanan "Tanggal dan jam entri" (dimundurkan tanggal/bulan/tahunnya).

  2. Dan posting ini juga tidak perlu ada komentar (pilih opsi "Komentar Pembaca" dengan "jangan izinkan").



  • Arahkan alamat browser kamu ke EmailMeForm.

  • Apabila kamu belum ada akun di EmailMeForm, klik Signup Now for Free.

  • Setelah selesai ngisi form pendaftaran, tunggu verifikasi email.

  • Kalau udah nongol di email kamu, klik link untuk verifikasi dan kamu akan dibawa kembali ke halaman EmailMeForm.

  • Login dengan akun kamu.

  • Klik Control Panel --> "Create a New Form".

  • Step 1

Web form Name :  Nama yang kamu inginkan, atau biarkan saja (contoh :  Kontak Kami, Contact Us, etc).

Recipients Emails :  Alamat email yang akan menerima pesan.

Thank you page : Alamat halaman web/blog yang berisi ucapan terima kasih. Kalau kamu membuat seperti pada point pertama, maka kamu bisa memasukkan alamat postingannya disini.
  • Next  --> Step 2

Berisi form yang akan diisi oleh pengunjung blog untuk mengontak kita via email, terdiri dari : Your Name, Your Email Address, Subject, dan Message. Bisa kamu rubah atau biarkan sesuai dengan yang ada.
  • Next  --> Step 3

  • Next  --> Step 4

  • Next  --> Step 5

  • Next  --> Step 6



  • Finish

  • Klik "get the HTML Code" --> Copy kode dalam text area di bawah tulisan "Copy and paste this HTML code into your page:" dan paste dalam notepad atau text editor lainnya.

  • Selanjutnya, buat sebuah postingan seperti biasa dan copas kode HTML di notepad ke dalam postingan kamu, contohnya seperti postingan "Kontak Kami" ini.

Catatan :

  1. Agar postingan "Kontak Kami" tidak muncul di halaman Beranda/Home (pada saat klik Terbitkan Entri/Publish Post), ubahlah tanggal posting dengan meng-klik "Opsi Entri", lihat sebelah kanan "Tanggal dan jam entri" (dimundurkan tanggal/bulan/tahunnya).

  2. Dan posting ini juga tidak perlu ada komentar (pilih opsi "Komentar Pembaca" dengan "jangan izinkan").



  • Terbitkan.

  • Terakhir buatlah link ke "Kontak Kami" yang berfungsi untuk memudahkan pengunjung menggunakan fasilitas ini, contoh ; menu navigasi, link di sidebar, dan sebagainya.

Selamat memasang "Kontak Kami" dengan widget EmailMeForm...

0 comments:

Spoiler apaan OB? "Oh, asessoris yang biasa digunakan di belakang mobil, sehingga kaya mobil balap". Kalau OB membahas mobil, apa ada hubungannya dengan optimasi blog??? (wkakakakakak). Maksud spoiler di sini adalah menyembunyikan teks, image, dan/atau widget sehingga menghemat ruang suatu blog. Kemudian teks, image, dan/atau widget tersebut dapat ditampilkan kembali dengan menggunakan perintah (baca: bahasa pemprograman) tertentu. Ujung-ujungnya kita menggunakan "button" lagi, "button" memang ngga ada matinya (he..he.. no promotion). Khusus pengguna Wordpress, pluginnya dapat langsung diunduh di felixtriller.de. Sedangkan untuk blogger, mari kita ulas triknya tentang memasang spoiler.


Widget ini dapat kamu manfaatkan baik dalam postingan, sidebar, dan/atau elemen lainnya yang memiliki kesesuaian dengan widget spoiler.




Adapun kode HTML-nya adalah sebagai berikut :

<div style="text-align: center;"><div class="button-spoiler"><input value="Contoh Penggunaan Spoiler" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka Lagi'; }" type="button"/></div><div class="spoiler"><div style="display: none;">

<div style="text-align: left; padding: 10px; border: 3px inset #333; font-size: small;">

Silakan disimak dan dicermati :

<ul
><li>Di sini kamu bisa memasukkan teks, kode, atau script</li>

<li>Kamu juga bisa memasukkan image</li>

<center><img border="0" alt="U Comments I Follow" src="http://i647.photobucket.com/albums/uu191/ariamsi/Icon%20Blog/follow2.jpg"/></center>

<li>Klik button "Tutup" untuk menghilangkan area ini</li></ul>

</div></div></div></div>


Keterangan :

  • Ganti kode berwarna biru dengan kata atau kalimat yang kamu inginkan.

  • Kode berwarna hijau merupakan gambaran area teks, image, dan/atau widget yang akan kamu masukan.

  • Ganti kode yang berwarna merah dengan teks, image, dan/atau widget yang akan kamu inginkan.

  • Tidak menutup kemungkinan kamu dapat menambah dan mengurangi kode yang telah ada selama format dasar kode pembuatan spoiler tidak berubah, seperti dalam kode style="....." (yang berkelap-kelip) dapat ditambah atau dikurangi.




Hasilnya :

Silakan disimak dan dicermati :
  • Di sini kamu bisa memasukkan teks, kode, atau script

  • Kamu juga bisa memasukkan image


  • U Comments I Follow

  • Klik button "Tutup" untuk menghilangkan area ini



Akhirnya selamat menyembunyikan teks, image, dan/atau widget dengan spoiler...


Memasang Button Show/Hide (Spoiler)

Posted by rike No comments

Spoiler apaan OB? "Oh, asessoris yang biasa digunakan di belakang mobil, sehingga kaya mobil balap". Kalau OB membahas mobil, apa ada hubungannya dengan optimasi blog??? (wkakakakakak). Maksud spoiler di sini adalah menyembunyikan teks, image, dan/atau widget sehingga menghemat ruang suatu blog. Kemudian teks, image, dan/atau widget tersebut dapat ditampilkan kembali dengan menggunakan perintah (baca: bahasa pemprograman) tertentu. Ujung-ujungnya kita menggunakan "button" lagi, "button" memang ngga ada matinya (he..he.. no promotion). Khusus pengguna Wordpress, pluginnya dapat langsung diunduh di felixtriller.de. Sedangkan untuk blogger, mari kita ulas triknya tentang memasang spoiler.


Widget ini dapat kamu manfaatkan baik dalam postingan, sidebar, dan/atau elemen lainnya yang memiliki kesesuaian dengan widget spoiler.




Adapun kode HTML-nya adalah sebagai berikut :

<div style="text-align: center;"><div class="button-spoiler"><input value="Contoh Penggunaan Spoiler" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka Lagi'; }" type="button"/></div><div class="spoiler"><div style="display: none;">

<div style="text-align: left; padding: 10px; border: 3px inset #333; font-size: small;">

Silakan disimak dan dicermati :

<ul
><li>Di sini kamu bisa memasukkan teks, kode, atau script</li>

<li>Kamu juga bisa memasukkan image</li>

<center><img border="0" alt="U Comments I Follow" src="http://i647.photobucket.com/albums/uu191/ariamsi/Icon%20Blog/follow2.jpg"/></center>

<li>Klik button "Tutup" untuk menghilangkan area ini</li></ul>

</div></div></div></div>


Keterangan :

  • Ganti kode berwarna biru dengan kata atau kalimat yang kamu inginkan.

  • Kode berwarna hijau merupakan gambaran area teks, image, dan/atau widget yang akan kamu masukan.

  • Ganti kode yang berwarna merah dengan teks, image, dan/atau widget yang akan kamu inginkan.

  • Tidak menutup kemungkinan kamu dapat menambah dan mengurangi kode yang telah ada selama format dasar kode pembuatan spoiler tidak berubah, seperti dalam kode style="....." (yang berkelap-kelip) dapat ditambah atau dikurangi.




Hasilnya :

Silakan disimak dan dicermati :
  • Di sini kamu bisa memasukkan teks, kode, atau script

  • Kamu juga bisa memasukkan image


  • U Comments I Follow

  • Klik button "Tutup" untuk menghilangkan area ini



Akhirnya selamat menyembunyikan teks, image, dan/atau widget dengan spoiler...


0 comments:

Kamu tahu dong yang namanya "button", yap,... button yang kita optimasi kali ini merupakan visualisasi tombol yang ada pada layar monitor kamu. Pada saat kamu meng-klik tombol tersebut (dengan menggunakan mouse) maka akan terjadi sesuatu (Kamus Komputer dan Teknologi Informasi). Sok ilmiah, padahal nyontek tuh (ha..ha.. bruaaakkk). Kok, ada bunyi "bruaaakkk"-nya? Sorry, saking terpingkalnya, OB jatuh dari kursi. Kembali ke button! Untuk peng-kode-annya dalam HTML dijabarkan sebagai berikut :

<button type="button">Tulis teks kamu di sini</button>


Hasilnya :







Mudah bukan? Kalau begitu selesai deh postingnya... Lho kok simpel kali OB? It's just kidding, friend. Yuk, kita ikuti lanjutan trik blogger optimasi button dalam blog.


Sebelum beranjak lebih jauh, mari sama-sama kita kupas peng-kode-an sederhana lainnya untuk menghiasi sebuah "button". Contohnya seperti di bawah ini :



Adapun kode HTML "button di atas adalah :

<button type="button" style="background:#000000; color:#FFFFFF; font:bold 20px Verdana, Geneva, sans-serif; margin:5px 0 5px 0; padding: 0 10px 0 10px;">Click Me!</button>


Keterangan :

  • background : warna latar button.

  • color: warna teks/tulisan.

  • padding : Jarak tepi button dengan teks di dalamnya (ke dalam), 0 10px 0 10px artinya padding atas=0; kanan=10px; bawah=0; kiri=10px.

  • margin: jarak button dengan tepi bidang gambar (ke luar), 5px 0 5px 0 artinya margin atas=5px; kanan=0; bawah=5px; kiri=0.

  • font : huruf teks.

Catatan :
Masih banyak asessoris kode lainnya yang dapat kamu tambahkan dalam "button" tersebut.



Namun tidak jarang, kita ingin membuat lebih dari satu button dalam menghiasi blog. Apabila karakteristik "button" yang akan kamu tambahkan sama dengan "button" yang telah ada, tentu kamu akan senantiasa berulangkali menulis kode yang sama pula. Betul tidak? Alangkah kurang efesiennya penulisan kode HTML yang berulang-ulang tersebut. Sehingga adalah merupakan hal yang arif, jika kita mengatur kode tersebut agar lebih multiguna gitu loh. Nah, disinilah muncul peran CSS (jangan tanya kepanjangannya, ya?) yang bermanfaat untuk menampilkan elemen HTML. Mari kita ambil kode HTML "button" diatas dan akan kita jadikan ke dalam bentuk CSS :

#buttonku {

background:#000000;

color:#FFFFFF;

font:bold 20px Verdana, Geneva, sans-serif;

margin:5px 0 5px 0;

padding: 0 10px 0 10px; }


Catatan :

Dalam blog kode CSS biasanya berada diantara kode <b:skin><![CDATA[ ... ]]></b:skin>.



Selanjutnya tinggal mengatur HTML-nya seperti ini :

<button id="buttonku" type="button">Click Me!</button>

<button id="buttonku" type="button">Click Me too!</button>

<button id="buttonku" type="button">Click Me too..too!</button>

... dst


Hasilnya :









..dst



Catatan :

Apabila kamu ingin lebih memperdalam ilmu pemprograman ini yang di antaranya termasuk HTML dan CSS, coba kunjungi W3schools.



Hmm... rasanya ada yang kelupaan nih? Oh, iya...! Sekarang bagaimana kalau "button" tersebut ingin kita letakkan sebuah link. Caranya cukup mudah, yakni dengan menyisipkan kode HTML "button" ke dalam kode link yang lebih kurangnya digambarkan sebagai berikut :

<a href="...alamat yang dituju..." target="blank"><button type="button">Tulis teks kamu di sini</button></a>


Keterangan :

target="blank" diartikan link akan diarahkan ke tab baru.



Tips :

Jika link berada dalam blog kita sendiri, sebaiknya jangan diarahkan ke tab baru (boros he..he..). Sebaliknya jika link berada di luar area blog, silakan tambahkan kode target="blank" tersebut.



Contoh "button" dengan menggunakan link :

<a href="http://optimasi-blog.blogspot.com/"><button type="button">Optimasi Blog</button></a>

<a href="http://www.w3schools.com/" target="blank"><button type="button">W3Schools</button></a>


Hasilnya :









Kamu pun bisa mencoba untuk mengobrak-abrik kode lainnya, sehingga tampilan "button" tersebut berkesesuaian dengan apa yang kamu inginkan. Akhirnya, Selamat ber-"button" ria...

Membuat "Buttton" Sederhana dalam Blog

Posted by rike No comments

Kamu tahu dong yang namanya "button", yap,... button yang kita optimasi kali ini merupakan visualisasi tombol yang ada pada layar monitor kamu. Pada saat kamu meng-klik tombol tersebut (dengan menggunakan mouse) maka akan terjadi sesuatu (Kamus Komputer dan Teknologi Informasi). Sok ilmiah, padahal nyontek tuh (ha..ha.. bruaaakkk). Kok, ada bunyi "bruaaakkk"-nya? Sorry, saking terpingkalnya, OB jatuh dari kursi. Kembali ke button! Untuk peng-kode-annya dalam HTML dijabarkan sebagai berikut :

<button type="button">Tulis teks kamu di sini</button>


Hasilnya :







Mudah bukan? Kalau begitu selesai deh postingnya... Lho kok simpel kali OB? It's just kidding, friend. Yuk, kita ikuti lanjutan trik blogger optimasi button dalam blog.


Sebelum beranjak lebih jauh, mari sama-sama kita kupas peng-kode-an sederhana lainnya untuk menghiasi sebuah "button". Contohnya seperti di bawah ini :



Adapun kode HTML "button di atas adalah :

<button type="button" style="background:#000000; color:#FFFFFF; font:bold 20px Verdana, Geneva, sans-serif; margin:5px 0 5px 0; padding: 0 10px 0 10px;">Click Me!</button>


Keterangan :

  • background : warna latar button.

  • color: warna teks/tulisan.

  • padding : Jarak tepi button dengan teks di dalamnya (ke dalam), 0 10px 0 10px artinya padding atas=0; kanan=10px; bawah=0; kiri=10px.

  • margin: jarak button dengan tepi bidang gambar (ke luar), 5px 0 5px 0 artinya margin atas=5px; kanan=0; bawah=5px; kiri=0.

  • font : huruf teks.

Catatan :
Masih banyak asessoris kode lainnya yang dapat kamu tambahkan dalam "button" tersebut.



Namun tidak jarang, kita ingin membuat lebih dari satu button dalam menghiasi blog. Apabila karakteristik "button" yang akan kamu tambahkan sama dengan "button" yang telah ada, tentu kamu akan senantiasa berulangkali menulis kode yang sama pula. Betul tidak? Alangkah kurang efesiennya penulisan kode HTML yang berulang-ulang tersebut. Sehingga adalah merupakan hal yang arif, jika kita mengatur kode tersebut agar lebih multiguna gitu loh. Nah, disinilah muncul peran CSS (jangan tanya kepanjangannya, ya?) yang bermanfaat untuk menampilkan elemen HTML. Mari kita ambil kode HTML "button" diatas dan akan kita jadikan ke dalam bentuk CSS :

#buttonku {

background:#000000;

color:#FFFFFF;

font:bold 20px Verdana, Geneva, sans-serif;

margin:5px 0 5px 0;

padding: 0 10px 0 10px; }


Catatan :

Dalam blog kode CSS biasanya berada diantara kode <b:skin><![CDATA[ ... ]]></b:skin>.



Selanjutnya tinggal mengatur HTML-nya seperti ini :

<button id="buttonku" type="button">Click Me!</button>

<button id="buttonku" type="button">Click Me too!</button>

<button id="buttonku" type="button">Click Me too..too!</button>

... dst


Hasilnya :









..dst



Catatan :

Apabila kamu ingin lebih memperdalam ilmu pemprograman ini yang di antaranya termasuk HTML dan CSS, coba kunjungi W3schools.



Hmm... rasanya ada yang kelupaan nih? Oh, iya...! Sekarang bagaimana kalau "button" tersebut ingin kita letakkan sebuah link. Caranya cukup mudah, yakni dengan menyisipkan kode HTML "button" ke dalam kode link yang lebih kurangnya digambarkan sebagai berikut :

<a href="...alamat yang dituju..." target="blank"><button type="button">Tulis teks kamu di sini</button></a>


Keterangan :

target="blank" diartikan link akan diarahkan ke tab baru.



Tips :

Jika link berada dalam blog kita sendiri, sebaiknya jangan diarahkan ke tab baru (boros he..he..). Sebaliknya jika link berada di luar area blog, silakan tambahkan kode target="blank" tersebut.



Contoh "button" dengan menggunakan link :

<a href="http://optimasi-blog.blogspot.com/"><button type="button">Optimasi Blog</button></a>

<a href="http://www.w3schools.com/" target="blank"><button type="button">W3Schools</button></a>


Hasilnya :









Kamu pun bisa mencoba untuk mengobrak-abrik kode lainnya, sehingga tampilan "button" tersebut berkesesuaian dengan apa yang kamu inginkan. Akhirnya, Selamat ber-"button" ria...

0 comments:


Dilihat dari judul artikel kali ini navigasi blog yang dimaksud adalah navigasi yang terlihat saat pengguna internet melihat-lihat isi blog kita, dimana di bagian akhir dari sebuah artikel biasanya bertuliskan Older Posts untuk melihat postingan lama dan Newer Posts untuk melihat postingan artikel terbaru.



Navigasi Older Posts dan Newer Posts ini bisa diganti dengan navigasi yang lain seperti

Mengubah Navigasi Older Newer Posts Menjadi NEXT PREV

Posted by rike No comments


Dilihat dari judul artikel kali ini navigasi blog yang dimaksud adalah navigasi yang terlihat saat pengguna internet melihat-lihat isi blog kita, dimana di bagian akhir dari sebuah artikel biasanya bertuliskan Older Posts untuk melihat postingan lama dan Newer Posts untuk melihat postingan artikel terbaru.



Navigasi Older Posts dan Newer Posts ini bisa diganti dengan navigasi yang lain seperti

0 comments:




Artikel tentang Daftar Isi Blog sudah banyak diposting oleh para blogger baik yang berbahasa indonesia maupun berbahasa asing sudah seabrek artikel namun namanya juga manusia tidak ingin susah-susah mencari, maunya langsung saja dipasang di blog kesayangan supaya tidak repot. Begitu kira-kira harapan salah seorang pengikut group Belajar Ilmu Komputer di facebook yang mengirim pesan ke saya

Daftar Isi Blog Tidak Bertanggal

Posted by rike No comments




Artikel tentang Daftar Isi Blog sudah banyak diposting oleh para blogger baik yang berbahasa indonesia maupun berbahasa asing sudah seabrek artikel namun namanya juga manusia tidak ingin susah-susah mencari, maunya langsung saja dipasang di blog kesayangan supaya tidak repot. Begitu kira-kira harapan salah seorang pengikut group Belajar Ilmu Komputer di facebook yang mengirim pesan ke saya

0 comments:

navbarBagi kamu yang perduli dengan validasi terhadap blog kamu, saya rasa cara ini pantas diterapkan di blog blogspot kamu, karena engine blogspot terlalu banyak kode-kode validasi yang error.



Sekarang Anda dapat secara permanen menghapus navbar blogger tersebut.



Biasanya sangat mudah untuk menyembunyikan. Yang harus Anda lakukan hanyalah menambahkan sedikit kode dalam template.



Sebelumnya kami juga menggunakan kode CSS untuk hanya menyembunyikan navbar tersebut.



Cukup ikuti langkah-langkah di bawah ini



1. Login ke Blogger>> Tata Letak >> Edit HTML



2. Cari kode <body> dan tambahkan Kode berikut tepat di atas itu.



<script type='text/javascript'>

<![CDATA[

<!--

/*<body>*/

-->

]]>

</script>




Setelah itu simpan template dan Anda akan melihat gambar konformasi seperti di bawah ini.



navbar blogger





Klik widget menghapus dan navbar akan dihapus.









Kerugian utama menghapus adalah bahwa Anda juga akan menghapus Link Quick Edit gambar pensil quick editatau Link Quick Edit gambar kunci pas link wrench link di blog Anda, walaupun Anda sedang dalam keadaan login.



Cara Ini sangat banyak mengurangi valiadasi error pada blog kita.



Bagi kamu-kamu yang ingin blognya ingin mengurangi error pada validasi bisa membaca postingan tentang Step By Step Validasi Blogger disini...


Menghapus secara permanen navbar blogger Anda

Posted by rike No comments

navbarBagi kamu yang perduli dengan validasi terhadap blog kamu, saya rasa cara ini pantas diterapkan di blog blogspot kamu, karena engine blogspot terlalu banyak kode-kode validasi yang error.



Sekarang Anda dapat secara permanen menghapus navbar blogger tersebut.



Biasanya sangat mudah untuk menyembunyikan. Yang harus Anda lakukan hanyalah menambahkan sedikit kode dalam template.



Sebelumnya kami juga menggunakan kode CSS untuk hanya menyembunyikan navbar tersebut.



Cukup ikuti langkah-langkah di bawah ini



1. Login ke Blogger>> Tata Letak >> Edit HTML



2. Cari kode <body> dan tambahkan Kode berikut tepat di atas itu.



<script type='text/javascript'>

<![CDATA[

<!--

/*<body>*/

-->

]]>

</script>




Setelah itu simpan template dan Anda akan melihat gambar konformasi seperti di bawah ini.



navbar blogger





Klik widget menghapus dan navbar akan dihapus.









Kerugian utama menghapus adalah bahwa Anda juga akan menghapus Link Quick Edit gambar pensil quick editatau Link Quick Edit gambar kunci pas link wrench link di blog Anda, walaupun Anda sedang dalam keadaan login.



Cara Ini sangat banyak mengurangi valiadasi error pada blog kita.



Bagi kamu-kamu yang ingin blognya ingin mengurangi error pada validasi bisa membaca postingan tentang Step By Step Validasi Blogger disini...


0 comments:


Internet saat ini sudah tersedia dimana-mana, di sekolah, kampus, warnet, kantin, bar, hotel, kantor pemerintahan baik yang bebas penggunaannya (gratis) maupun yang berbayar.



Untuk yang bebas tentu tidak sebebas yang dipikirkan banyak orang termasuk saya...hehehe...tidak mungkinkan diberikan akses internet gratis begitu saja tentu ada syaratnya. Biasanya di sebuah kantin misalnya terdapat

Memilih Modem Terbaik

Posted by rike No comments


Internet saat ini sudah tersedia dimana-mana, di sekolah, kampus, warnet, kantin, bar, hotel, kantor pemerintahan baik yang bebas penggunaannya (gratis) maupun yang berbayar.



Untuk yang bebas tentu tidak sebebas yang dipikirkan banyak orang termasuk saya...hehehe...tidak mungkinkan diberikan akses internet gratis begitu saja tentu ada syaratnya. Biasanya di sebuah kantin misalnya terdapat

0 comments:

Sexy sliding Sidebar ini adalah alternatif lain pengganti Navigation Menu biasa, nah bila blog anda belum mempunyai Navigation Menu ataupun tidak ingin memakai Navigation Menu karena satu dan lain hal, Sexy sliding sidebar ini bisa menjadi alternatifnya.



sexy sidebar





Live Demo





Sekarang Mari Lihat Bagaimana Cara Memasangnya ....



  • Pertama login ke blogger

  • Pergi ke ---> Tata Letak

  • Klik Di Tambah Gadget

  • Pilih Html / Javascript

  • Dan Copy Paste Kode yang dibawah ini :



<script src="http://www.iblogerz.5gigs.net/sliding-side-bar-left/js/prototype.js" type="text/javascript"></script>

<script src="http://www.iblogerz.5gigs.net/sliding-side-bar-left/js/effects.js" type="text/javascript"></script>

<script src="http://www.iblogerz.5gigs.net/sliding-side-bar-left/js/side-bar.js" type="text/javascript"></script>

<style>

body{

font-size:75%;

}

a{

outline: none;

}

a:active{

outline: none;

}

#sideBar{

text-align:left;

}

#sideBar h2{

color:#FFFFFF;

font-size:110%;

font-family:arial;

margin:10px 10px 10px 10px;

font-weight:bold !important;

}

#sideBar h2 span{

font-size:125%;

font-weight:normal !important;

}

#sideBar ul{

margin:0px 0px 0px 0px;

padding:0px 0px 0px 0px;

}

#sideBar li{

margin:0px 10px 3px 10px;

padding:2px;

list-style-type:none;

display:block;

background-color:#DA1074;

width:177px;

color:#FFFFFF;

}

#sideBar li a{

width:100%;

}

#sideBar li a:link,

#sideBar li a:visited{

color:#FFFFFF;

font-family:verdana;

font-size:100%;

text-decoration:none;

display:block;

margin:0px 0px 0px 0px;

padding:0px;

width:100%;

}

#sideBar li a:hover{

color:#FFFFFF;

text-decoration:underline;

}

#sideBar{

position: fixed;

width: auto;

height: auto;

top: 140px;

left:0px;

background-image:url(http://i49.tinypic.com/121abrq.jpg);

background-position:top right;

background-repeat:repeat-y;

}

#sideBarTab{

float:left;

height:137px;

width:28px;

}

#sideBarTab img{

border:0px solid #FFFFFF;

}

#sideBarContents{

float:left;

overflow:hidden !important;

width:200px;

height:320px;

}

#sideBarContentsInner{

width:200px;

}</style>

<div id="sideBar">

<div id="sideBarContents" style="display:none;">

<div id="sideBarContentsInner">

<h2>side<span>bar</span></h2>

<ul>

<li><a href="#">Link One</a></li>

<li><a href="#">Link Two</a></li>

<li><a href="#">Link Three</a></li>

<li><a href="#">Link Four</a></li>

</ul>

</div> </div>

<a id="sideBarTab" href="#"><img alt="sideBar" src="http://i46.tinypic.com/ao8h9u.jpg" title="sideBar"/></a>

</div>




Sekarang Klik Simpan ...



Rubah Kode warna Merah Dengan Link Dan Teks Dari Pilihan Anda



Sekarang lihat hasilnya Blog Anda....


Menambah Sexy Sliding Sidebar di Blogspot

Posted by rike No comments

Sexy sliding Sidebar ini adalah alternatif lain pengganti Navigation Menu biasa, nah bila blog anda belum mempunyai Navigation Menu ataupun tidak ingin memakai Navigation Menu karena satu dan lain hal, Sexy sliding sidebar ini bisa menjadi alternatifnya.



sexy sidebar





Live Demo





Sekarang Mari Lihat Bagaimana Cara Memasangnya ....



  • Pertama login ke blogger

  • Pergi ke ---> Tata Letak

  • Klik Di Tambah Gadget

  • Pilih Html / Javascript

  • Dan Copy Paste Kode yang dibawah ini :



<script src="http://www.iblogerz.5gigs.net/sliding-side-bar-left/js/prototype.js" type="text/javascript"></script>

<script src="http://www.iblogerz.5gigs.net/sliding-side-bar-left/js/effects.js" type="text/javascript"></script>

<script src="http://www.iblogerz.5gigs.net/sliding-side-bar-left/js/side-bar.js" type="text/javascript"></script>

<style>

body{

font-size:75%;

}

a{

outline: none;

}

a:active{

outline: none;

}

#sideBar{

text-align:left;

}

#sideBar h2{

color:#FFFFFF;

font-size:110%;

font-family:arial;

margin:10px 10px 10px 10px;

font-weight:bold !important;

}

#sideBar h2 span{

font-size:125%;

font-weight:normal !important;

}

#sideBar ul{

margin:0px 0px 0px 0px;

padding:0px 0px 0px 0px;

}

#sideBar li{

margin:0px 10px 3px 10px;

padding:2px;

list-style-type:none;

display:block;

background-color:#DA1074;

width:177px;

color:#FFFFFF;

}

#sideBar li a{

width:100%;

}

#sideBar li a:link,

#sideBar li a:visited{

color:#FFFFFF;

font-family:verdana;

font-size:100%;

text-decoration:none;

display:block;

margin:0px 0px 0px 0px;

padding:0px;

width:100%;

}

#sideBar li a:hover{

color:#FFFFFF;

text-decoration:underline;

}

#sideBar{

position: fixed;

width: auto;

height: auto;

top: 140px;

left:0px;

background-image:url(http://i49.tinypic.com/121abrq.jpg);

background-position:top right;

background-repeat:repeat-y;

}

#sideBarTab{

float:left;

height:137px;

width:28px;

}

#sideBarTab img{

border:0px solid #FFFFFF;

}

#sideBarContents{

float:left;

overflow:hidden !important;

width:200px;

height:320px;

}

#sideBarContentsInner{

width:200px;

}</style>

<div id="sideBar">

<div id="sideBarContents" style="display:none;">

<div id="sideBarContentsInner">

<h2>side<span>bar</span></h2>

<ul>

<li><a href="#">Link One</a></li>

<li><a href="#">Link Two</a></li>

<li><a href="#">Link Three</a></li>

<li><a href="#">Link Four</a></li>

</ul>

</div> </div>

<a id="sideBarTab" href="#"><img alt="sideBar" src="http://i46.tinypic.com/ao8h9u.jpg" title="sideBar"/></a>

</div>




Sekarang Klik Simpan ...



Rubah Kode warna Merah Dengan Link Dan Teks Dari Pilihan Anda



Sekarang lihat hasilnya Blog Anda....


0 comments:

Social Bookmark Widget ini adalah sebuah revolusi baru untuk blogger. Hal ini memungkinkan pengunjung blog Anda dengan cepat berbagi postingan blog Anda ke Situs Social Bookmar populer. Yang paling penting dalam widget ini adalah tampilannya. Widget ini cocok untuk semua jenis blogger template dan 100% kompatibel dengan semua blogspot template dan layout termasuk xml blogger template premium.



Caranya cukup sederhana untuk memasukkan di blog blogspot, jadi mari kita lihat bagaimana melakukannya.





Pertama login ke Blogger. Pergi ke Layout --> Edit / Html

cek pada Expand Widget Konten



Kemudian cari kode :



<data:post.body/>



Ganti kode diatas dengan kode-kode pilihan kamu dibawah ini :



small social bookmark





<data:post.body/><br /><script type="text/javascript" src="http://www.letsgetsocialnow.com/source-codes/small.js" language="JavaScript"></script>






medium db





<data:post.body/><br /><script type="text/javascript" src="http://www.letsgetsocialnow.com/source-codes/medium.js" language="JavaScript"></script>






larger sb





<data:post.body/><br /><script type="text/javascript" src="http://www.letsgetsocialnow.com/source-codes/large.js" language="JavaScript"></script>






Sekarang simpan template kamu dan lihat hasilnya......


Gratis: Social Bookmark Widget di bawah setiap Posting Blog

Posted by rike No comments

Social Bookmark Widget ini adalah sebuah revolusi baru untuk blogger. Hal ini memungkinkan pengunjung blog Anda dengan cepat berbagi postingan blog Anda ke Situs Social Bookmar populer. Yang paling penting dalam widget ini adalah tampilannya. Widget ini cocok untuk semua jenis blogger template dan 100% kompatibel dengan semua blogspot template dan layout termasuk xml blogger template premium.



Caranya cukup sederhana untuk memasukkan di blog blogspot, jadi mari kita lihat bagaimana melakukannya.





Pertama login ke Blogger. Pergi ke Layout --> Edit / Html

cek pada Expand Widget Konten



Kemudian cari kode :



<data:post.body/>



Ganti kode diatas dengan kode-kode pilihan kamu dibawah ini :



small social bookmark





<data:post.body/><br /><script type="text/javascript" src="http://www.letsgetsocialnow.com/source-codes/small.js" language="JavaScript"></script>






medium db





<data:post.body/><br /><script type="text/javascript" src="http://www.letsgetsocialnow.com/source-codes/medium.js" language="JavaScript"></script>






larger sb





<data:post.body/><br /><script type="text/javascript" src="http://www.letsgetsocialnow.com/source-codes/large.js" language="JavaScript"></script>






Sekarang simpan template kamu dan lihat hasilnya......


0 comments:

Apture Navbar

Satu lagi navbar pengganti bawaan blogger yang pantas anda pasang pada blog Anda, selain daripada WIBIA. Bagi kamu-kamu yang sudah menghilangkan Navbar dafault dari blogspot bisa memasang Navbar Apture ini.



Apture bar yg bernaung dalam perusahaan swasta dan bermarkas di San Francisco, California ini menawarkan tampilan navbar guna berbagi berpenampilan menarik. Pada posisi diatas tidak tampak, kalau di scroll kebawah baru kehilahatan.



Oke, kita langsung aja ya,

1. Masuk ke website Apture

2. Isi alamat Blog kamu serta alamat email yang valid.

3. Isi judul, title blog kamu atau apapun terserah.

4. Modifikasi warna dari Apture tersebut.

5. lalu klik Get My Bar.



Setelah itu muncul Javascript codenya yang bisa kamu copy paste keblog kamu dengan tahapan sebagai berikut :



1. Sign In ke blogger.com

2. klik Tata Letak kemudian Edit HTML

3. Cari kode </body>

4. Letakkan kode Apture diatas kode no.3



Selesai dan lihat hasilnya di blog kamu


Pasang Navbar Statis ala Apture

Posted by rike No comments

Apture Navbar

Satu lagi navbar pengganti bawaan blogger yang pantas anda pasang pada blog Anda, selain daripada WIBIA. Bagi kamu-kamu yang sudah menghilangkan Navbar dafault dari blogspot bisa memasang Navbar Apture ini.



Apture bar yg bernaung dalam perusahaan swasta dan bermarkas di San Francisco, California ini menawarkan tampilan navbar guna berbagi berpenampilan menarik. Pada posisi diatas tidak tampak, kalau di scroll kebawah baru kehilahatan.



Oke, kita langsung aja ya,

1. Masuk ke website Apture

2. Isi alamat Blog kamu serta alamat email yang valid.

3. Isi judul, title blog kamu atau apapun terserah.

4. Modifikasi warna dari Apture tersebut.

5. lalu klik Get My Bar.



Setelah itu muncul Javascript codenya yang bisa kamu copy paste keblog kamu dengan tahapan sebagai berikut :



1. Sign In ke blogger.com

2. klik Tata Letak kemudian Edit HTML

3. Cari kode </body>

4. Letakkan kode Apture diatas kode no.3



Selesai dan lihat hasilnya di blog kamu


0 comments:


Search Engine atau bahasa indonesia dikenal dengan nama Mesin Pencari adalah sebuah situs yang memiliki database elektonis yang menyimpan informasi berupa alamat-alamat situs, email dan informasi lainnya yang bertebaran diseluruh dunia.




Ada banyak search engine didunia internet namun yang paling terkenal dan paling banyak digunakan saat ini adalah mesin pencari google. Selain mesin pencari

Tips Melakukan Pencarian Search Engine

Posted by rike No comments


Search Engine atau bahasa indonesia dikenal dengan nama Mesin Pencari adalah sebuah situs yang memiliki database elektonis yang menyimpan informasi berupa alamat-alamat situs, email dan informasi lainnya yang bertebaran diseluruh dunia.




Ada banyak search engine didunia internet namun yang paling terkenal dan paling banyak digunakan saat ini adalah mesin pencari google. Selain mesin pencari

0 comments:

Pusing.........!!! Ternyata banyak yang berubah di dunia pem-Blogger-an. Tidak terlepas pada yang satu ini, yaitu Technorati. Technorati adalah salah satu search engine yang mengkhususkan diri pada blog, saat ini sudah jutaan blog yang terdaftar di Technorati. Sebagai sebuah komunitas yang besar, Technorati bisa menjadi salah satu sumber untuk mendapatkan pengunjung. Karena itu sangat berasalan bagi kita untuk ikut mendaftarkan blog yang kita buat pada Technorati. Disamping untuk menjaring pengunjung, Technorati juga bisa dijadikan alat untuk mencari link dari blog-blog lain yang mempunyai tema yang sama.



Technorati merupakan salah satu directory blog yang cukup populer, Sampai saat ini technorati masih menjadi favorite para blogger jadi tidak ada salahnya jika kita mendaftarkan kelayanan ini. Keuntungan dari layanan ini yaitu selain blog kita akan dikenal luas sekaligus meningkatkan trafik pada blog kita (Wikipedia).


Kalau sekedar urusan sign up (mendaftar) pasti teman-teman sudah tahu step by stepnya. Namun OB cuman mau berbagi bagaimana cara mengklaim blog kita di Technorati, yakni :

  • Setelah login, buka profil. Shourcutnya klik aja nama (username) di pojok kanan atas halaman technorati

  • Nah, terus rolling ke bawah di sana ada baris isian alamat blog. Ketik alamat blog kamu.

  • Klik "Claim Blog".

  • Selanjutnya kamu akan dikirimkan token (semacam kode verifikasi) ke email kamu, contoh : 47FR3WUYH2ZC.

  • Masukkan token tersebut ke salah satu postingan blog kamu (tinggal masukkan saja kodenya), contoh : Biasanya optimasi blog menjadi suatu wahana belajar dan pembelajaran, maklum kita sama-sama manusia yang butuh belajar. Optimasi Blog merupakan kumpulan tips seo dan trik blogger tentu saja diulas dengan bahasa Indonesia yang gaul abis 47FR3WUYH2ZC. Yuk, kita sama-sama belajar tentang optimasi blog dan jangan sampai ketinggalan yah.


  • Terbitkan entry, maka secara otomatis token tersebut akan terdeteksi oleh Technorati.

  • Kembali ke site Technorati, klik "Check Claim"

  • Klik "Verify Claim Token" dan jika sukses, maka Technorati kembali mengirimkan email.

  • Next kamu dapat menghapus token tersebut setelah blog kamu terdeteksi oleh Tefchnorati.


Mudah-mudahan informasi ini bermanfaat dan klaim blog kita dapat diterima. Selamat mendaftarkan blog kamu ke Technorati.

Cara Claim Blog di Technorati

Posted by rike No comments

Pusing.........!!! Ternyata banyak yang berubah di dunia pem-Blogger-an. Tidak terlepas pada yang satu ini, yaitu Technorati. Technorati adalah salah satu search engine yang mengkhususkan diri pada blog, saat ini sudah jutaan blog yang terdaftar di Technorati. Sebagai sebuah komunitas yang besar, Technorati bisa menjadi salah satu sumber untuk mendapatkan pengunjung. Karena itu sangat berasalan bagi kita untuk ikut mendaftarkan blog yang kita buat pada Technorati. Disamping untuk menjaring pengunjung, Technorati juga bisa dijadikan alat untuk mencari link dari blog-blog lain yang mempunyai tema yang sama.



Technorati merupakan salah satu directory blog yang cukup populer, Sampai saat ini technorati masih menjadi favorite para blogger jadi tidak ada salahnya jika kita mendaftarkan kelayanan ini. Keuntungan dari layanan ini yaitu selain blog kita akan dikenal luas sekaligus meningkatkan trafik pada blog kita (Wikipedia).


Kalau sekedar urusan sign up (mendaftar) pasti teman-teman sudah tahu step by stepnya. Namun OB cuman mau berbagi bagaimana cara mengklaim blog kita di Technorati, yakni :

  • Setelah login, buka profil. Shourcutnya klik aja nama (username) di pojok kanan atas halaman technorati

  • Nah, terus rolling ke bawah di sana ada baris isian alamat blog. Ketik alamat blog kamu.

  • Klik "Claim Blog".

  • Selanjutnya kamu akan dikirimkan token (semacam kode verifikasi) ke email kamu, contoh : 47FR3WUYH2ZC.

  • Masukkan token tersebut ke salah satu postingan blog kamu (tinggal masukkan saja kodenya), contoh : Biasanya optimasi blog menjadi suatu wahana belajar dan pembelajaran, maklum kita sama-sama manusia yang butuh belajar. Optimasi Blog merupakan kumpulan tips seo dan trik blogger tentu saja diulas dengan bahasa Indonesia yang gaul abis 47FR3WUYH2ZC. Yuk, kita sama-sama belajar tentang optimasi blog dan jangan sampai ketinggalan yah.


  • Terbitkan entry, maka secara otomatis token tersebut akan terdeteksi oleh Technorati.

  • Kembali ke site Technorati, klik "Check Claim"

  • Klik "Verify Claim Token" dan jika sukses, maka Technorati kembali mengirimkan email.

  • Next kamu dapat menghapus token tersebut setelah blog kamu terdeteksi oleh Tefchnorati.


Mudah-mudahan informasi ini bermanfaat dan klaim blog kita dapat diterima. Selamat mendaftarkan blog kamu ke Technorati.

0 comments:

Weleh-weleh met jumpa lagi kawan bersama OB. OB kembali mengudara di channel blogger frekuensi Optimasi-Blog (ha..ha.. kaya penyiar radio aja). Untuk kali pertama ini, OB coba untuk mengulas sekelumit info tentang trik blogger. Sekarang coba teman-teman perhatikan tag cloud dan top posting. Hm... ternyata sudah kadaluarsa alias tidak berlaku lagi. Yang ketinggalan posting top komentator, untung admin Mas Rudy sudah mengisi trik ini. Nah, OB kebagian top posting dan tag cloud, tapi satu-satu yah. OB akan coba untuk mengulas trik blogger top posting terlebih dahulu. Agar lebih terdefinisi trik ini OB dapatkan setelah googling ke blognya "Kang Salman".


Ayo, buruan kita simak bersama satu tembang cantik dengan title Revisi Cara Memasang Top Posting. Begini deh lagunya :

  • Login dulu ke account blogger kamu

  • Pilih tab Tata Letak --> Edit HTML --> centang "Expand Template Widget"

Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

  • Cari kode top posting terdahulu, yang kalau ngga salah seperti ini :

<script type="text/javascript">

function pipeCallback(obj) {

document.write('<ol style="text-transform: capitalize;">');

var i;

for (i = 0; i < obj.count ; i++)

{

var href = "'" + obj.value.items[i].link + "'";

var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";

document.write(item);

}

document.write('</ol>');

}

</script>

<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=1cf38ae68efbe859c4ba1ee239cec099&url=http%3A%2F%2Foptimasi-blog.blogspot.com&num=5" type="text/javascript"></script>


Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

  • Ganti semua kode tersebut dengan kode berikut :

<script type="text/javascript">

function pipeCallback(obj) {

document.write('<ul style="text-transform: capitalize;">');

var i;

for (i = 0; i < obj.count ; i++)

{

var href = "'" + obj.value.items[i].link + "'";

var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";

document.write(item);

}

document.write('</ul>');

}

</script>

<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=ff855e4f4d4a10fde1c2eb32074f99cd&url=http://optimasi-blog.blogspot.com&num=5" type="text/javascript"></script>


Catatan :

Ganti kode yang berwarna merah dengan alamat blog kamu dan jumlah top posting yang akan ditampilkan.

  • Jangan lupa disimpan

Sekarang coba lihat tampilan blog kamu udah nongol atau belum top postingnya dan selanjutnya selamat utak-atik top posting dech.

Revisi Cara Memasang Top Posting

Posted by rike No comments

Weleh-weleh met jumpa lagi kawan bersama OB. OB kembali mengudara di channel blogger frekuensi Optimasi-Blog (ha..ha.. kaya penyiar radio aja). Untuk kali pertama ini, OB coba untuk mengulas sekelumit info tentang trik blogger. Sekarang coba teman-teman perhatikan tag cloud dan top posting. Hm... ternyata sudah kadaluarsa alias tidak berlaku lagi. Yang ketinggalan posting top komentator, untung admin Mas Rudy sudah mengisi trik ini. Nah, OB kebagian top posting dan tag cloud, tapi satu-satu yah. OB akan coba untuk mengulas trik blogger top posting terlebih dahulu. Agar lebih terdefinisi trik ini OB dapatkan setelah googling ke blognya "Kang Salman".


Ayo, buruan kita simak bersama satu tembang cantik dengan title Revisi Cara Memasang Top Posting. Begini deh lagunya :

  • Login dulu ke account blogger kamu

  • Pilih tab Tata Letak --> Edit HTML --> centang "Expand Template Widget"

Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

  • Cari kode top posting terdahulu, yang kalau ngga salah seperti ini :

<script type="text/javascript">

function pipeCallback(obj) {

document.write('<ol style="text-transform: capitalize;">');

var i;

for (i = 0; i < obj.count ; i++)

{

var href = "'" + obj.value.items[i].link + "'";

var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";

document.write(item);

}

document.write('</ol>');

}

</script>

<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=1cf38ae68efbe859c4ba1ee239cec099&url=http%3A%2F%2Foptimasi-blog.blogspot.com&num=5" type="text/javascript"></script>


Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

  • Ganti semua kode tersebut dengan kode berikut :

<script type="text/javascript">

function pipeCallback(obj) {

document.write('<ul style="text-transform: capitalize;">');

var i;

for (i = 0; i < obj.count ; i++)

{

var href = "'" + obj.value.items[i].link + "'";

var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";

document.write(item);

}

document.write('</ul>');

}

</script>

<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=ff855e4f4d4a10fde1c2eb32074f99cd&url=http://optimasi-blog.blogspot.com&num=5" type="text/javascript"></script>


Catatan :

Ganti kode yang berwarna merah dengan alamat blog kamu dan jumlah top posting yang akan ditampilkan.

  • Jangan lupa disimpan

Sekarang coba lihat tampilan blog kamu udah nongol atau belum top postingnya dan selanjutnya selamat utak-atik top posting dech.

0 comments:

Sebenarnya ini bukan tutorial yang baru bagi pada blogger mania, akan tetapi dalam artikel ini saya akan menyajikan sekalian dua tutorial tentang reply comment pada blogspot.

Ya, memang ada dua pada saat ini untuk membuat kolom komentar pada blogspot bisa diaplikasikan reply comment, oke kita mulai saja....

Reply Comment Pertama

Pada tutorial pertama ini akan menyajikan cara yang sedikit ribet karena kita harus merombak semua CSS dan HTML pada kotak komentar blog kita.

Kelebihannya : reply comment bakal mirip seperti pada blog wordpress, yaitu kolom balas komentar langsung terletak pada kolom yang ingin kita balas.

Kekurangan : kita harus terlebih dahulu memasukkan ID blog komentar jika ingin membalas komentar...





Untuk membuat seperti itu silahkan ikuti tutorial berikut ini

1. Login blogger

2. Tata Letak

3. Edit HTML

4. Downlaod Template Lengkap dahulu untuk mengamnakan template Anda

5. Centang Expand Template Widget

6. Letakkan kode di bawah ini dibawah ]]></b:skin>



<script src='http://komenbalas.googlecode.com/files/commentreply%282%29.js' type='text/javascript'/>


Catatan : sebaiknya anda melihat postingan tentang membuat kolom komentar blog, lalu hapus kode Komentar pada CSS cara pertama dan kode HTMLnya juga..



7. Letakkan kode berikut ini di atas ]]></b:skin>



.comment-segment {margin-top: 10px;margin-right: 10px;}

.comment-level-0 {margin-left: 10px;}

.comment-level-1 {margin-left: 25px;}

.comment-level-2 {margin-left: 40px;}

.comment-level-3 {margin-left: 55px;}

.comment-level-gt3 {margin-left: 70px;}

.blog-author-comment {background-color: #DFE6EF;border: 1px solid #7296E2;}

.blog-nonauthor-comment {background-color: #ffffff;border: 1px solid #000000;}

.deleted-comment {color: gray; font-STYLE: italic}

.delete-comment-icon {background: url("http://www.blogblog.com/rounders3/icon_delete13.gif") no-repeat;}

.comment-time {font-size: 80%;margin: inherit;padding-left: 10px;padding-bottom:10px;}

.reply-guide {background-color: #FFFFFF;border: #076a93 1px dotted;display: none;

padding-right: 10px;padding-left: 10px;padding-bottom: 0.75em;padding-top: 5px;margin-right: 10px;margin-bottom: 10px;}

.reply-guide-header {color: #076a93;padding-top: 10px;}

.reply-guide-list {list-style: none;padding-left: 2px;margin-left: 2px;}

.reply-guide-example {font-size: 85%;margin-right: 5px;margin-bottom: 10px;float: right;border: 1px dotted #076a93;padding: 5 5 5 5;}

.trackback { padding:9px 0 0 26px; margin:10px 0 0 0; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJqmBVqIUXLT_ivbQjmEfh5UKijJMgz3Fc0bGb__WPHcNTycg6enXpzp91WVbsy9FVkbQnL-va5BCizKFY1KVNZ5HThXPp9R6_6WOXY-bKXcbu6cFTQ0xXkwgymcr7j0l_f3vdoknRqkU/?imgmax=800) no-repeat left; color:#000;}


8. Cari kode berikut ini



<b:includable id='comments' var='post'>
<div class='comments' id='comments'>

...

</div>

</b:includable>


Tanda titik-titik di tengah script di atas menunjukkan script yang panjang jadi tidak saya tulis. Gunakan yang berwarna merah untuk mempermudah menemukan lokasi.



Jika sudah ketemu, ganti keseluruhan kode di atas dengan kode di bawah ini



<b:includable id='comments' var='post'>

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

<a name='comments'/>

<b:if cond='data:post.allowComments'>

<h4>

<b:if cond='data:post.numComments == 1'> 1 <data:commentLabel/>:

<b:else/><data:post.numComments/><data:commentLabelPlural/>:

</b:if>

</h4>



<b:if cond='data:post.numComments &gt; 0'>

<!-- Include a post comment link before rendering the comments -->

</b:if>



<!-- Loop through the comments adding the comment bodies in a hidden div -->

<b:loop values='data:post.comments' var='comment'>

<div expr:id='&quot;comment-body-&quot; + data:comment.id' style='display: none;'>

<data:comment.body/>

</div>

</b:loop>

<!-- Now create the comment using our javascript -->

<script type='text/javascript'>

// Use this if you have just one author like this blog :)

var BLOG_AUTHOR = &#39;http://www.blogger.com/profile/YOURBLOGID&#39;;

var BLOG_POST_COMMENT_LINK = &#39;<data:post.addCommentUrl/>&#39;;



var eCommentDelete = false;

var eAuthorUrl = &#39;&#39;;

<b:loop values='data:post.comments' var='comment'>

eCommentDelete = false;

eAuthorUrl = &#39;&#39;;

<b:if cond='data:comment.authorUrl'>

eAuthorUrl = &quot;<data:comment.authorUrl/>&quot;;

</b:if>

<b:if cond='data:comment.isDeleted'>

eCommentDelete = true;

</b:if>



buildComment(&quot;<data:comment.author/>&quot;, eAuthorUrl,

&quot;<data:comment.id/>&quot;, &quot;<data:comment.timestamp/>&quot;, eCommentDelete,

&quot;<data:comment.deleteUrl/>&quot;, &quot;<data:top.deleteCommentMsg/>&quot;,

document.getElementById(&#39;comment-body-<data:comment.id/>&#39;).innerHTML);

</b:loop>

// <![CDATA[

var eCommentTemplate = '' +

'<div class="comment-segment comment-level-${COMMENT.LEVEL} ${BLOG.AUTHOR} ${COMMENT.DELETED.STYLE}" >' + 'n' +

' <a name="comment-${COMMENT.ID}"></a>' + 'n' +

' <span style="float: right; margin-right: 5px; " >' + 'n' +

' <a href="#" ' + 'n' +

' onclick="toggleElementDisplays(this, ' +

'['comment-${COMMENT.ID}-body', 'comment-${COMMENT.ID}-footer', 'reply-guide-${COMMENT.ID}'], ' +

'['both', 'both', 'hide']); return false;" >[hide]</a>' + 'n' +

' </span>' + 'n' +

' <span class="comment-author" >' +

'${COMMENT.AUTHOR.URL.EXISTS.START}' +

'<a href="${COMMENT.AUTHOR.URL}" rel="nofollow">' +

'${COMMENT.AUTHOR.URL.EXISTS.END}' +

'${COMMENT.AUTHOR.NAME}' +

'${COMMENT.AUTHOR.URL.EXISTS.START}' +

'</a>' +

'${COMMENT.AUTHOR.URL.EXISTS.END}</span>' + 'n' +

' mengatakan... ' + 'n' +

' <span class="comment-time">on ${COMMENT.TIMESTAMP}</span>' + 'n' +

' <div id="comment-${COMMENT.ID}-body" class="comment-body" ><p>${COMMENT.BODY}</p></div>' + 'n' +

' <div id="reply-guide-${COMMENT.ID}" class="reply-guide comment-level-0 " >' + 'n' +

' <span style="float: right;" ><a href="#" onclick="hideElement('reply-guide-${COMMENT.ID}'); return false;" >[hide]</a></span>' + 'n' +

' <p class="reply-guide-header">Id Komentar ini : ${COMMENT.ID}</p>' + 'n' +

' </div>' + 'n' +

' <div id="comment-${COMMENT.ID}-footer" class="comment-footer">' + 'n' +

' <span><a ' +

'href="#" onclick="showElement('reply-guide-${COMMENT.ID}'); return false;" >Lihat Id Komentar</a></span> ' + 'n' +



' <span><a href="${COMMENT.DELETE.URL}" title="${COMMENT.DELETE.TEXT}" style="text-decoration: none;" >Hapus</span></a></span>' + 'n' +

' </div>' + 'n' +

'</div>' + 'n';



applyCommentTemplate(eCommentTemplate);

// ]]>



</script>

<p class='comment-footer'>

<p class='comment-footer'>

<b:if cond='data:post.embedCommentForm'>

<b:include data='post' name='comment-form'/>

<b:else/>

<b:if cond='data:post.allowComments'>

<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>

</b:if>

</b:if>

</p>

</p>

</b:if>

<div id='backlinks-container'>

<div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>

<b:if cond='data:post.showBacklinks'>

<b:include data='post' name='backlinks'/>

</b:if>

</div>

</div>

</div>

</b:includable>


Pada script panjang di atas, perhatikan yang berwarna merah. Ganti dengan alamat profil blogger Anda untuk membuat komentar Anda nantinya berbeda warna. Jika sudah Simpan Template.



Trik ini memang sedikit panjang namun dijamin hasilnya sangat bagus. Jika biasanya berurutan yang paling dahulu berkomentar akan berada di list paling atas daftar komentar dan yang terakhir paling bawah. Dengan model ini meski Anda berkomentar terakhir Anda bisa mengambil tempat di tengah-tengah dengan menjawab komentar seseorang.



Reply Comment Kedua



Nah kalau cara yang ini lebi simple lagi karena kita tidak terlalu banyak mengacak-acak kode komentar yang ada pada blog kita..

Kelebihan : scriptnya sedikit dan tidak merubah total kolom komentar pada blog kita

Kekurangan : reply comment tidak bisa langsung terletak dibawah komentar yang kita balas, melainkan tetap terletak pada kolom paling bawah.



Oke, kita mulai saja ya...



cara 1 sampai 5 sama seperti diatas..



6. Cari kode seperti yang dibawah ini:



<data:commentPostedByMsg/>


7. Kemudian Copy dan Paste kode berikut tepat dibawah kode yang diatas :



<span class="comment-reply"><a expr:href="&quot;https://www.blogger.com/comment.g?blogID=YOUR-BLOG-ID&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;" href="" onclick="javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;">[Reply to comment]</a></span>


8. Pada kode diatas ada tulisan yang berwarna biru (Your Blog ID) isi dengan ID Blogger sobat pada blog yang akan di install tombol reply. setelah semua settingan benar, kemudian save template sobat.



contoh penerapan reply comment kedua ini bisa anda lihat pada blog RudyAzhar ini.



Oke, begitulah cara membuat blogspot kita bisa reply comment, masing-masing ada kelebihan dan kelemahannya karena tutorial ini adalah hasil modifikasi dari pada blogger mania yang senang dengan utak atik blog.



Semoga kedepannya blogger.com bisa mengaplikasikan reply comment pada blogspot...



Selamat mencoba, dan jika masih kurang paham bisa langsung menuliskan unek-uneknya pada kotak komentar dibawah ini....



Original Post :



Reply Comment pertama : Shams blog

Reply Comment kedua : thisichen.com

Blogger Reply Comment

Posted by rike No comments

Sebenarnya ini bukan tutorial yang baru bagi pada blogger mania, akan tetapi dalam artikel ini saya akan menyajikan sekalian dua tutorial tentang reply comment pada blogspot.

Ya, memang ada dua pada saat ini untuk membuat kolom komentar pada blogspot bisa diaplikasikan reply comment, oke kita mulai saja....

Reply Comment Pertama

Pada tutorial pertama ini akan menyajikan cara yang sedikit ribet karena kita harus merombak semua CSS dan HTML pada kotak komentar blog kita.

Kelebihannya : reply comment bakal mirip seperti pada blog wordpress, yaitu kolom balas komentar langsung terletak pada kolom yang ingin kita balas.

Kekurangan : kita harus terlebih dahulu memasukkan ID blog komentar jika ingin membalas komentar...





Untuk membuat seperti itu silahkan ikuti tutorial berikut ini

1. Login blogger

2. Tata Letak

3. Edit HTML

4. Downlaod Template Lengkap dahulu untuk mengamnakan template Anda

5. Centang Expand Template Widget

6. Letakkan kode di bawah ini dibawah ]]></b:skin>



<script src='http://komenbalas.googlecode.com/files/commentreply%282%29.js' type='text/javascript'/>


Catatan : sebaiknya anda melihat postingan tentang membuat kolom komentar blog, lalu hapus kode Komentar pada CSS cara pertama dan kode HTMLnya juga..



7. Letakkan kode berikut ini di atas ]]></b:skin>



.comment-segment {margin-top: 10px;margin-right: 10px;}

.comment-level-0 {margin-left: 10px;}

.comment-level-1 {margin-left: 25px;}

.comment-level-2 {margin-left: 40px;}

.comment-level-3 {margin-left: 55px;}

.comment-level-gt3 {margin-left: 70px;}

.blog-author-comment {background-color: #DFE6EF;border: 1px solid #7296E2;}

.blog-nonauthor-comment {background-color: #ffffff;border: 1px solid #000000;}

.deleted-comment {color: gray; font-STYLE: italic}

.delete-comment-icon {background: url("http://www.blogblog.com/rounders3/icon_delete13.gif") no-repeat;}

.comment-time {font-size: 80%;margin: inherit;padding-left: 10px;padding-bottom:10px;}

.reply-guide {background-color: #FFFFFF;border: #076a93 1px dotted;display: none;

padding-right: 10px;padding-left: 10px;padding-bottom: 0.75em;padding-top: 5px;margin-right: 10px;margin-bottom: 10px;}

.reply-guide-header {color: #076a93;padding-top: 10px;}

.reply-guide-list {list-style: none;padding-left: 2px;margin-left: 2px;}

.reply-guide-example {font-size: 85%;margin-right: 5px;margin-bottom: 10px;float: right;border: 1px dotted #076a93;padding: 5 5 5 5;}

.trackback { padding:9px 0 0 26px; margin:10px 0 0 0; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJqmBVqIUXLT_ivbQjmEfh5UKijJMgz3Fc0bGb__WPHcNTycg6enXpzp91WVbsy9FVkbQnL-va5BCizKFY1KVNZ5HThXPp9R6_6WOXY-bKXcbu6cFTQ0xXkwgymcr7j0l_f3vdoknRqkU/?imgmax=800) no-repeat left; color:#000;}


8. Cari kode berikut ini



<b:includable id='comments' var='post'>
<div class='comments' id='comments'>

...

</div>

</b:includable>


Tanda titik-titik di tengah script di atas menunjukkan script yang panjang jadi tidak saya tulis. Gunakan yang berwarna merah untuk mempermudah menemukan lokasi.



Jika sudah ketemu, ganti keseluruhan kode di atas dengan kode di bawah ini



<b:includable id='comments' var='post'>

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

<a name='comments'/>

<b:if cond='data:post.allowComments'>

<h4>

<b:if cond='data:post.numComments == 1'> 1 <data:commentLabel/>:

<b:else/><data:post.numComments/><data:commentLabelPlural/>:

</b:if>

</h4>



<b:if cond='data:post.numComments &gt; 0'>

<!-- Include a post comment link before rendering the comments -->

</b:if>



<!-- Loop through the comments adding the comment bodies in a hidden div -->

<b:loop values='data:post.comments' var='comment'>

<div expr:id='&quot;comment-body-&quot; + data:comment.id' style='display: none;'>

<data:comment.body/>

</div>

</b:loop>

<!-- Now create the comment using our javascript -->

<script type='text/javascript'>

// Use this if you have just one author like this blog :)

var BLOG_AUTHOR = &#39;http://www.blogger.com/profile/YOURBLOGID&#39;;

var BLOG_POST_COMMENT_LINK = &#39;<data:post.addCommentUrl/>&#39;;



var eCommentDelete = false;

var eAuthorUrl = &#39;&#39;;

<b:loop values='data:post.comments' var='comment'>

eCommentDelete = false;

eAuthorUrl = &#39;&#39;;

<b:if cond='data:comment.authorUrl'>

eAuthorUrl = &quot;<data:comment.authorUrl/>&quot;;

</b:if>

<b:if cond='data:comment.isDeleted'>

eCommentDelete = true;

</b:if>



buildComment(&quot;<data:comment.author/>&quot;, eAuthorUrl,

&quot;<data:comment.id/>&quot;, &quot;<data:comment.timestamp/>&quot;, eCommentDelete,

&quot;<data:comment.deleteUrl/>&quot;, &quot;<data:top.deleteCommentMsg/>&quot;,

document.getElementById(&#39;comment-body-<data:comment.id/>&#39;).innerHTML);

</b:loop>

// <![CDATA[

var eCommentTemplate = '' +

'<div class="comment-segment comment-level-${COMMENT.LEVEL} ${BLOG.AUTHOR} ${COMMENT.DELETED.STYLE}" >' + 'n' +

' <a name="comment-${COMMENT.ID}"></a>' + 'n' +

' <span style="float: right; margin-right: 5px; " >' + 'n' +

' <a href="#" ' + 'n' +

' onclick="toggleElementDisplays(this, ' +

'['comment-${COMMENT.ID}-body', 'comment-${COMMENT.ID}-footer', 'reply-guide-${COMMENT.ID}'], ' +

'['both', 'both', 'hide']); return false;" >[hide]</a>' + 'n' +

' </span>' + 'n' +

' <span class="comment-author" >' +

'${COMMENT.AUTHOR.URL.EXISTS.START}' +

'<a href="${COMMENT.AUTHOR.URL}" rel="nofollow">' +

'${COMMENT.AUTHOR.URL.EXISTS.END}' +

'${COMMENT.AUTHOR.NAME}' +

'${COMMENT.AUTHOR.URL.EXISTS.START}' +

'</a>' +

'${COMMENT.AUTHOR.URL.EXISTS.END}</span>' + 'n' +

' mengatakan... ' + 'n' +

' <span class="comment-time">on ${COMMENT.TIMESTAMP}</span>' + 'n' +

' <div id="comment-${COMMENT.ID}-body" class="comment-body" ><p>${COMMENT.BODY}</p></div>' + 'n' +

' <div id="reply-guide-${COMMENT.ID}" class="reply-guide comment-level-0 " >' + 'n' +

' <span style="float: right;" ><a href="#" onclick="hideElement('reply-guide-${COMMENT.ID}'); return false;" >[hide]</a></span>' + 'n' +

' <p class="reply-guide-header">Id Komentar ini : ${COMMENT.ID}</p>' + 'n' +

' </div>' + 'n' +

' <div id="comment-${COMMENT.ID}-footer" class="comment-footer">' + 'n' +

' <span><a ' +

'href="#" onclick="showElement('reply-guide-${COMMENT.ID}'); return false;" >Lihat Id Komentar</a></span> ' + 'n' +



' <span><a href="${COMMENT.DELETE.URL}" title="${COMMENT.DELETE.TEXT}" style="text-decoration: none;" >Hapus</span></a></span>' + 'n' +

' </div>' + 'n' +

'</div>' + 'n';



applyCommentTemplate(eCommentTemplate);

// ]]>



</script>

<p class='comment-footer'>

<p class='comment-footer'>

<b:if cond='data:post.embedCommentForm'>

<b:include data='post' name='comment-form'/>

<b:else/>

<b:if cond='data:post.allowComments'>

<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>

</b:if>

</b:if>

</p>

</p>

</b:if>

<div id='backlinks-container'>

<div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>

<b:if cond='data:post.showBacklinks'>

<b:include data='post' name='backlinks'/>

</b:if>

</div>

</div>

</div>

</b:includable>


Pada script panjang di atas, perhatikan yang berwarna merah. Ganti dengan alamat profil blogger Anda untuk membuat komentar Anda nantinya berbeda warna. Jika sudah Simpan Template.



Trik ini memang sedikit panjang namun dijamin hasilnya sangat bagus. Jika biasanya berurutan yang paling dahulu berkomentar akan berada di list paling atas daftar komentar dan yang terakhir paling bawah. Dengan model ini meski Anda berkomentar terakhir Anda bisa mengambil tempat di tengah-tengah dengan menjawab komentar seseorang.



Reply Comment Kedua



Nah kalau cara yang ini lebi simple lagi karena kita tidak terlalu banyak mengacak-acak kode komentar yang ada pada blog kita..

Kelebihan : scriptnya sedikit dan tidak merubah total kolom komentar pada blog kita

Kekurangan : reply comment tidak bisa langsung terletak dibawah komentar yang kita balas, melainkan tetap terletak pada kolom paling bawah.



Oke, kita mulai saja ya...



cara 1 sampai 5 sama seperti diatas..



6. Cari kode seperti yang dibawah ini:



<data:commentPostedByMsg/>


7. Kemudian Copy dan Paste kode berikut tepat dibawah kode yang diatas :



<span class="comment-reply"><a expr:href="&quot;https://www.blogger.com/comment.g?blogID=YOUR-BLOG-ID&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;" href="" onclick="javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;">[Reply to comment]</a></span>


8. Pada kode diatas ada tulisan yang berwarna biru (Your Blog ID) isi dengan ID Blogger sobat pada blog yang akan di install tombol reply. setelah semua settingan benar, kemudian save template sobat.



contoh penerapan reply comment kedua ini bisa anda lihat pada blog RudyAzhar ini.



Oke, begitulah cara membuat blogspot kita bisa reply comment, masing-masing ada kelebihan dan kelemahannya karena tutorial ini adalah hasil modifikasi dari pada blogger mania yang senang dengan utak atik blog.



Semoga kedepannya blogger.com bisa mengaplikasikan reply comment pada blogspot...



Selamat mencoba, dan jika masih kurang paham bisa langsung menuliskan unek-uneknya pada kotak komentar dibawah ini....



Original Post :



Reply Comment pertama : Shams blog

Reply Comment kedua : thisichen.com

0 comments:

Blogger templates. Proudly Powered by Blogger.
back to top