• RSS
  • Facebook
  • Twitter
  • Linkedin

Friday, November 28, 2008

Menambah Animasi Tampilan Blogger

Posted by dav on 12:04 AM with
Artikel kali ini bener-bener bingung membuat judulnya, tapi yang jelas para pengunjung bisa melihat animasi bendera Merah Putih pada blog ini, entah sebelah mana ya? dan entah apa disebutnya. Tips ini termasuk sederhana dalam penerapan pada template blogger. Mau coba manambah animasi pada tampilan blogger kita? silahkan ikuti langkah berikut ini.

Langkah Menambah Animasi Tampilan Blogger

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke bagian "Tata Letak - Edit HTML"
Langkah 3
Cari kode dibawah ini :
]]></b:skin>
Langkah 4
Masukan kode dibawah ini tepat diatas Langkah 3 :
#animasi_gambar {
position:fixed;_position:absolute;top:0px; left:0px;
clip:inherit;
_top:expressionundefineddocument.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expressionundefineddocument.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
Langkah 5
Cari lagi kode dibawah ini yang paling bawah dari template :
</body>
Langkah 6
Masukan kode dibawah ini tepat dibawahnya :
<div id='animasi_gambar'>
<a href='http://modification-blog.blogspot.com'>
<img border='0' src='http://URL.com/gambar_animasi.gif'/></a>
</div>
Langkah 7
Klik "SIMPAN TEMPLATE"

Perhatian!
  • Ubah URL pada Langkah 6 (baris 2) sesuai dengan alamat blog kita
  • Gantilah animasi pada Langkah 6 (baris 3) sesuai dimana URL tempat kita menyimpan animasi
  • Animasi harus berformat GIF
  • Background Animasi GIF harus transparant
  • Ubah kode pada pada Langkah 4 (berwarna biru) untuk menempatkan posisi gambar, top=atas, bottom=bawah, left=kiri, right=kanan

Wednesday, November 26, 2008

Memanajemen Arsip Blog

Posted by dav on 7:11 AM with
Memanajemen arsip blog sangatlah penting, karena pengunjung akan merasa nyaman dan betah berlama-lama mengunjungi blog kita jika navigasi dalam blog kita mudah dicerna, menarik dan cepat dalam proses pencarian artikel. Manajemen arsip blog sangat cocok digabungkan dengan artikel sebelumnya "Menampilkan Judul Artikel Tanpa Isi Halaman", mudah-mudahan sudah memahami dan menerapkan trik blog tersebut. Manajemen arsip memudahkan pengunjung untuk menemukan arsip artikel yang dicari. Ketika pengunjung mencari artikel sesuai dengan kategori/label, biasanya blog akan menampilkan artikel secara keseluruhan (baca: judul artikel dan isi halaman artikel) dan dalam jumlah yang sudah kita set, hal ini akan memperlambat loading page halaman blog kita dan hal ini akan membuat pengunjung malas meneruskan pencarian artikel dalam blog kita. Mencegah pengunjung kabur dari blog kita, ikutilah trik mamanjemen Arsip blog berikut.

Membuat Daftar Isi Artikel Blog
Layaknya sebuah buku, kadang kita merasa malas harus membuka halaman satu persatu untuk mencari artikel yang kita inginkan pada sebuah buku jika jumlah halamannya banyak. Untuk mencari sebuah artikel dalam sebuah buku biasanya kita akan melihat daftar isi, membaca judul dan melihat halaman artikel tersebut, lebih cepat dan efektif. Begitupun dengan blog, kita buatkan pengunjung daftar isi supaya mereka mudah dalam proses pencarian artikel yang dibutuhkan, tapi sebelumnya blog kita sudah menerapkan "Menampilkan Judul Artikel Tanpa Isi Halaman", jika tidak "Manajemen Arsip Blog" tetap tidak akan efektif bahkan akan jadi bumerang bagi kita pemilik blog, pengunjung kabur dan trafik anjlok. Kalau sudah seperti itu "Tamatlah Riwayat Blog" kita.
Berikut langkah pembuatan daftar isi artikel blog :
Langkah 1
Login ke Blogger
Langkah 2
Masuk kebagian "Tata Letak - Elemen Halaman" dan buatlah "LinkList"
Langkah 3
Masukan Link dibawah ini pada LinkList :
http://ALAMAT-BLOG.blogspot.com/search?max-result=300
Jangan lupa beri nama link tersebut (misal: Daftar Isi)
Langkah 4
Klik "Tambah URL" dan klik tombol "SIMPAN"

Keterangan :
  • Ganti ALAMAT-BLOG dengan url blog anda.
  • Angka 300 menunjukan jumlah artikel yang akan ditampilkan, ubahlah sesuai keinginan anda.
  • Jangan lupa blog anda harus sudah menerapkan "Menampilkan Judul Artikel Tanpa Isi Halaman" sehingga ketika pengunjung meng-klik Link "Daftar Isi" maka blog hanya akan menampilkan judul artikelnya saja.

Membuat Daftar Isi per Kategori/Label
Label atau kategori ibarat BAB didalam buku, didalam BAB tersebut terdapat sub BAB dan seterusnya. Dengan mengatur jumlah artikel per kategori/label, proses pencarian artikel lebih cepat, karena blog akan menampilkan artikel sesuai kategori/label yang pengunjung inginkan serta jumlah artikel yang akan ditampilkan bisa kita atur.
Berikut langkah pembuatan daftar isi per kategori/label :
Langkah 1
Login ke Blogger
Langkah 2
Masuk kebagian "Tata Letak - Edit HTML" dan "Expand Template Widget" (Jangan lupa untuk mem-backup template terlebih dahulu)
Langkah 3
Cari kode dibawah ini :
data:label.url
Langkah 4
Tambahkan kode dibawah ini (berwarna biru) :
data:label.url + &quot;?max-results=300&quot;
Langkah 4
Klik "SIMPAN TEMPLATE"

Keterangan :
  • Ubahlah angka 300 untuk menentukan jumlah artikel yang akan ditampilkan
  • Kode pada langkah 3 biasanya ada sekitar 3 kode, tambahkanlah seluruh kode seperti pada langkah 4

Membuang Header Tanggal Artikel
Sebenarnya dengan tidak membuang header tanggal artikel juga tidak menjadi masalah, tapi bagi yang ingin blognya terlihat rapi silahkan ikuti trik blog dibawah ini. Header tanggal artikel akan ikut ditampilkan jika pengunjung melihat daftar isi. Hal ini akan membuat ruang halaman blog menjadi bertambah dan terlihat tidak rapi, apalagi bagi blogger yang update blognya tidak teratur, maka pada saat menampilkan daftar isi judul artikel akan terselipi header tanggal artikel.
Untuk membuang header tanggal artikel ikuti langkah berikut :
Langkah 1
Login ke Blogger dan "Backup Template"
Langkah 2
Masuk kebagian "Tata Letak - Edit HTML" dan "Expand Template Widget" (Jangan lupa untuk mem-backup template terlebih dahulu)
Langkah 3
Cari kode dibawah ini dan buang/delete:
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
Atau jika hanya ingin menyembunyikan (tanpa membuang) tambahkan kode (warna biru) seperti dibawah ini :
<!--<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>-->
Langkah 4
Klik "SIMPAN TEMPLATE"

Happy Blogging...:)

Saturday, November 22, 2008

Menampilkan Komentar dengan Grazr

Posted by dav on 5:58 AM with
Komentar dari para pengunjung itu kadang membuat kita tersenyum, marah atau biasa-biasa saja. Tapi terkadang kita jenuh harus scroll jauh-jauh karena yang memberi komentar banyak, coba silahkan berkunjung ke Ningtyas, Lyla atau Fatamorgana, jujur saja aku sampai males harus baca komentar-komentar para pengunjung. Supaya komentar-komentar tersebut terlihat rapi dan mudah dibaca (baca:mudah dalam navigasi) kita bisa menggunakan fasilitas gratis yang telah diberikan oleh Grazr. Sebelum memasang pada blogger silahkan lihat hasilnya disini.

Pemasangan Komentar Grazr
Langkah 1
Login ke Blogger
Langkah 2
Tambah Gadget HTML/JavaScript
Langkah 3
Masukan kode dibawah ini pada bagian konten :
<center><div style="height:150px;width:99%;"><a href="http://grazr.com/read?view=s&theme=default&file=http://NAMA-BLOG.blogspot.com/feeds/comments/default"><img alt="Grazr" style="border:none" src="http://static.grazr.com/images/grazrbadge.png"/></a><script src="http://static.grazr.com/gzloader.js?view=o&amp;theme=default&amp;addbar=on&amp;file=http://NAMA-BLOG.blogspot.com/feeds/comments/default" defer="defer" type="text/javascript"></script><br/><a href="http://modification-blog.blogspot.com/2008/11/menampilkan-komentar-dengan-grazr.html" target="_blank">Grab this widget</a></div></center>

Keterangan :
  • Ubah NAMA-BLOG dengan nama/alamat url blog anda
  • Ubah height:150px untuk menentukan tinggi widget
  • Ubah width:99% untuk menentukan lebar widget atau ubah 99% dengan px
  • Ubah view=o menjadi s atau 3p untuk menentukan cara pemunculan isi komentar; o=outline, s=slider dan 3p=3pane
  • Ubahlah theme=default untuk menentukan theme, ada sekitar 14 theme
  • Buanglah kode addbar=on jika kita tidak ingin menampilkan link url komentar blog kita
Theme Komentar Grazr :
  • Default = default
  • Default Big Title = default_big_title
  • Gloss Black = gloss_black
  • Gloss Blue = gloss_blue
  • Gloss Red = gloss_red
  • Gloss Silver = gloss_silver
  • Home Silver = home_silver
  • Milk Coco = milk_coco
  • Milk Pink = milk_pink
  • Milk White = milk_white
  • Sateen Black = sateen_black
  • Sateen Blue = sateen_blue
  • Sateen Green = sateen_green
  • Sateen Red = sateen_red

Tuesday, November 18, 2008

Widget Google Translator untuk Blogger

Posted by dav on 7:24 PM with
Google tidak henti-hentinya melakukan perbaikan dan penambahan fasilitas, salah satunya Google Translator. Walaupun belum semua bahasa didukung dan masih ada beberapa bahasa dalam versi beta. Dengan adanya fasilitas Google Translator maka seluruh pengunjung dari berbagai belahan dunia (baca: yang didukung Google Translator) akan dengan mudah memahami detail artikel yang kita tulis. Beberapa waktu kebelakang Google Translator belum mendukung Bahasa Indonesia, tapi kini (walaupun terlambat) Google Translator telah mendukung Bahasa Indonesia, makanya bagi para pemilik blog/website memasang Google Translator adalah menjadi keharusan supaya pembaca setianya tidak berasal dari lokal saja (satu daerah atau satu keturunan atau satu bahasa).
Pada artikel ini kita akan mencoba membahas tiga jenis Google Translator, yaitu :

Google Translator Widget (W3C Recommended)
Google translator jenis ini menurut informasi telah diakui oleh W3C (World Wide Web Consortium), artinya sudah disahkan dan sudah tidak terdapat kesalahan dalam script Google Translator tersebut dan merupakan widget yang paling mudah dalam pemasangan pada blogger.
Langkah pemasangan Google Translator Widget (W3C Recommended) :
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<script src=http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&amp;up_source_language=en&amp;w=160&amp;h=60&amp;title=&amp;border=&amp;output=js></script>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :

Google Translator Widget Menu Dropdown
Widget yang satu ini sangat sederhana dalam tampilan tapi cukup lengkap dengan beberapa bahasa yang didukung, lebih dari 30 bahasa.
Langkah pemasangan Google Translator Widget Menu Dropdown :
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<form action='http://translate.google.com/translate_c?' target='_blank'>
<table id='gotrans'>
<tr><td> <select name='tl' style='width: 15em;'>
<option value='ar'>Arabic</option>
<option value='bg'>Bulgarian</option>
<option value='ca'>Catalan</option>
<option value='zh-cn'>Chinese undefinedSimplified)</option>
<option value='zh-tw'>Chinese undefinedTraditional)</option>
<option value='hr'>Croatian</option>
<option value='cs'>Czech</option>
<option value='da'>Danish</option>
<option value='nl'>Dutch</option>
<option selected='en'>English</option>
<option value='tl'>Filipino</option>
<option value='fi'>Finnish</option>
<option value='fr'>French</option>
<option value='de'>German</option>
<option value='el'>Greek</option>
<option value='iw'>Hebrew</option>
<option value='hi'>Hindi</option>
<option value='it'>Italian</option>
<option value='ja'>Japanese</option>
<option value='ko'>Korean</option>
<option value='lv'>Latvian</option>
<option value='lt'>Lithuanian</option>
<option value='no'>Norwegian</option>
<option value='pl'>Polish</option>
<option value='pt'>Portuguese</option>
<option value='ro'>Romanian</option>
<option value='ru'>Russian</option>
<option value='sr'>Serbian</option>
<option value='sk'>Slovak</option>
<option value='sl'>Slovenian</option>
<option value='es'>Spanish</option>
<option value='sv'>Swedish</option>
<option value='uk'>Ukrainian</option>
<option value='vi'>Vietnamese</option>
</select>
<script language="JavaScript">
<!--
document.write undefined'<input name=u value='+location.href+' type=hidden>')
// -->
</script>
<input name='sl' type='hidden' value='id'/>
<input name='hl' type='hidden' value='en'/>
<input name='ie' type='hidden' value='UTF-8'/>
<input style='width: auto;' type='submit' value='Translate'/>
</td></tr></table></form>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :

Google Translator Widget Mini Flags
Jenis ini paling banyak diminati, karena lebih bagus dalam hal tampilan. Terdapat bendera yang mewakili bahasa tertentu sehingga pengunjung tinggal memilih bendera untuk menentukan bahasa yang dikehendakinya.

Google Translator Widget Mini Flags Bujur Sangkar :
Langkah pemasangan Google Translator Widget Mini Flags Bujur Sangkar:
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<table width="99%" border="0" bgcolor="#00FFFF">
<tr>
<td width="99%">
<center>Translate this blog!<br/>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cen&amp;hl=en&amp;ie=UTF8'); return false;" title="English"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="English" src="http://dedehendriono.googlepages.com/UnitedKingdomGreatBritain.png" height="32" title="English"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Car&amp;hl=en&amp;ie=UTF8'); return false;" title="Arabic"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Arabic" src="http://dedehendriono.googlepages.com/SaudiArabia.png" height="32" title="Arabic"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cvi&amp;hl=en&amp;ie=UTF8'); return false;" title="Vietnamese"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Vietnamese" src="http://dedehendriono.googlepages.com/VietNam.png" height="32" title="Vietnamese"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Ces&amp;hl=en&amp;ie=UTF8'); return false;" title="Spanish "><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Spanish " src="http://dedehendriono.googlepages.com/Spain.png" height="32" title="Spanish "/></a>
<br/>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Czh-CN&amp;hl=en&amp;ie=UTF8'); return false;" title="Chinese undefinedSimplified)"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Chinese undefinedSimplified)" src="http://dedehendriono.googlepages.com/China.png" height="32" title="Chinese undefinedSimplified)"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cfr&amp;hl=en&amp;ie=UTF8'); return false;" title="French "><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="French " src="http://dedehendriono.googlepages.com/France.png" height="32" title="French "/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cde&amp;hl=en&amp;ie=UTF8'); return false;" title="German"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="German" src="http://dedehendriono.googlepages.com/Germany.png" height="32" title="German"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cit&amp;hl=en&amp;ie=UTF8'); return false;" title="Italian"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Italian" src="http://dedehendriono.googlepages.com/Italy.png" height="32" title="Italian"/></a>
<br/>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cja&amp;hl=en&amp;ie=UTF8'); return false;" title="Japanese BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Japanese BETA" src="http://dedehendriono.googlepages.com/Japan.png" height="32" title="Japanese BETA"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cko&amp;hl=en&amp;ie=UTF8'); return false;" title="Korean BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Korean BETA" src="http://dedehendriono.googlepages.com/SouthKorea.png" height="32" title="Korean BETA"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cru&amp;hl=en&amp;ie=UTF8'); return false;" title="Russian BETA "><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Russian BETA " src="http://dedehendriono.googlepages.com/RussianFederation.png" height="32" title="Russian BETA "/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://modification-blog.blogspot.com'); return false;" title="Grab this widget"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Grab this widget" src="http://dedehendriono.googlepages.com/hendriono.png" height="32" title="Grab this widget"/></a></center></td></tr>
</table>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :

Google Translator Widget Mini Flags Memanjang :
Langkah pemasangan Google Translator Widget Mini Flags Bujur Memanjang:
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<form action="http://translate.google.com/translate_c?" target="_blank">
<script language="JavaScript">
<!--
document.write undefined"<input name=u value="+location.href+" type=hidden>")
// -->
</script>
<input name="hl" value="id" type="hidden">
<input name="ie" value="UTF8" type="hidden">
<input name="langpair" value="" type="hidden">
<input name="langpair" value="id|en" title="English" src= "http://dedehendriono.googlepages.com/UnitedKingdom24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|fr" title="French" src= "http://dedehendriono.googlepages.com/France24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|de" title="German" src= "http://dedehendriono.googlepages.com/Germany24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|it" title="Italian" src= "http://dedehendriono.googlepages.com/Italy24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|pt" title="Portuguese" src= "http://dedehendriono.googlepages.com/Portugal24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|es" title="Spanish" src= "http://dedehendriono.googlepages.com/Spain24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|ja" title="Japanese" src= "http://dedehendriono.googlepages.com/japan24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|ko" title="Korean" src= "http://dedehendriono.googlepages.com/SouthKorea24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|zh-CN" title="Chinese Simplified" src= "http://dedehendriono.googlepages.com/China24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair2" value="id|ar" title="Arabic" src= "http://dedehendriono.googlepages.com/SaudiArabia24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24" />
</form>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :
Happy Blogging :)

Memasang Favicons Pada Blogger

Posted by dav on 3:17 AM with
Favicon merupakan salah satu style/gaya sebuah website dan sekaligus sebagai suatu ciri khas bagi pada pemilik website atau blogger. Walaupun sederhana tetapi setiap pengunjung secara tidak langsung akan menandai sebuah blog melalui Favicon, selain itu juga memperindah boorkmark pada browser, sehingga ketika kita akan berkunjung kembali ke website tersebut kita tidak perlu membaca alamat link yang bersangkutan cukup dengan melihat sepintas Favicon.
Pada saat yang lalu saya mencoba memasang Favicons pada blog saya tetapi selalu gagal. Favicon yang saya masukan pada template selalu diganti/replace dengan Favicon default blogger. Sebenarnya dimana letak kesalahan pemasangannya. Ternyata setelah ditelaah dengan melihat source code asli tampilan blog kita, blogger secara default memasang favicon dengan alamat dibawah ini :
<link href='http://www.blogger.com/favicon.ico' rel='icon' type='image/vnd.microsoft.icon'/>
Sangat mudah untuk memperbaiki hal tersebut, ikuti langkah berikut :
Langkah 1
Siapkan favicon yang akan kita gunakan, jika ingin mencari inspirasi silahkan kunjungi link dibawah ini :
Jika malas anda tinggal arahkan mouse pada favicon yang kita sukai pada website diatas, klik kanan dan save as.
Langkah 2
Simpan favicon tersebut pada webhosting kita (misal googlepages)
Langkah 3
Login ke Blogger
Langkah 4
Masuk ke "Tata Letak - Edit HTML" dan cari kode dibawah ini :
</head>
Langkah 5
Letakan kode dibawah ini tepat diatas kode Langkah 4 :
<link href='http://alamat-url.com/favicon.png' rel='shortcut icon'/>
<link href='http://alamat-url.com/favicon.png' rel='icon'/>
Langkah 6
Simpan Template

Perhatian!
  • Gantilah alamat-url dengan alamat url tempat kita menyimpan Favicon
  • Kita bisa menggunakan favicon dengan format .ico, .png atau .gif
Happy blogging :)

Monday, November 17, 2008

Mengganti Komentar Default Blogger dengan HaloScan

Posted by dav on 5:41 PM with
Sesuai janji saya pada posting Apa dan Siapa HaloScan, sekarang kita akan mencoba memasangnya pada Blogger. Tapi harap diperhatikan resiko yang bakal kita tanggung, saya mencoba mengulangi resiko yang akan kita tanggung :
  • Kehilangan komentar default yang pernah ada sebelum pemasangan HaloScan dan otomatis kita kehilangan linkback.
  • Setiap komentar yang diberikan oleh blogger lain secara otomatis hanya akan dilinkback ke HaloScan bukan ke blogger kita, ini justru akan meningkatkan trafik ke HaloScan.
  • Komentar yang sudah ada ketika HaloScan sudah terpasang akan dihapus total karena database disimpan pada HaloScan bukan disimpan pada blog kita. Ini berarti ketika kita menghapus HaloScan yang akan muncul adalah komentar sebelum pemasangan HaloScan sedangkan komentar sesudah pemasangan HaloScan akan dihapus.
Berikut langkah pemasangan komentar dari HaloScan :
Langkah 1
Login ke Blogger
Langkah 2
Backup/Download terlebih dahulu template anda melalui menu "Tata Letak - Edit HTML" dan klik link "Download Template Lengkap" kemudian simpan dalam komputer anda.
Langkah 3
Buatlah Account baru di HaloScan disini, kemudian pilih Signup Now!. Isi data-data yang diperlukan.
Langkah 4
Loginlah ke HaloScan dengan Account yang baru saja anda buat lalu klik "Install"
Langkah 5
Klik "Blogger or Blogspot (New Version / Google Login) - NEW Automatic install available!". Hilangkan tanda Check "Display trackback code" dan "Display rating stars". Kemudian Klik "Next>>"
Langkah 6
Masukan template yang sudah kita download (lihat Langkah 2) melalui tombol "Choose..." dan klik "Upload Blogger Template", tunggu beberapa saat, HaloScan sedang melakukan pemasangan Script pada template blog kita.
Langkah 7
Klik "Download New Template" dan simpan pada komputer kita. (Minum dulu...)
Langkah 8
Login kembali ke blogger (jika tadi sudah Logout)
Langkah 9
Masuk lagi ke menu "Tata Letak - Edit HTML", klik tombol "Browse" dan kemudian klik tombol "Unggah". Tunggu proses pemasangan template modifikasi dari HaloScan sampai keluar "Perubahan telah disimpan". Sampai disini anda sudah berhasil.
Langkah 10
Check komentar anda, jika tampil kotak komentar dibawah artikel berarti anda sudah berhasil...
Perhatian!
  • Ingatlah bahwa kekuatan blog bukan hanya pada komentar tetapi pada kekuatan konten/isi materi blog kita, komentar hanya sebagai penunjang trafic.
  • HaloScan menurut websitenya menggunakan Plugin Akismet yang biasa digunakan pada Wordpress yang sudah teruji kekuatannya untuk menghalau Spam.
  • Meningkatkann trafic blog bukan seberapa jumlah komentar yang ada tetapi seberapa banyak orang mengunjungi blog kita.
  • Komentar dari HaloScan lebih mudah dimanajemen karena merupakan fasilitas yang terpisah dari blogger.
  • Semua diatas berlaku pada baru-baru ini, entah kedepan jika telah diadakan penyempurnaan oleh pihak HaloScan.
Dalam artikel mendatang kita akan bahas cara mengembalikan blogger template setelah pemasangan HaloScan secara manul. Happy Blogging :)

Friday, November 14, 2008

Formulir Komentar Di Bawah Posting/Artikel

Posted by dav on 5:03 AM with
Banyak yang mencoba atau bahkan hanya berkhayal (hati-hati bukan hal yang berbau pornograpi, bugil, sexy atau apalah namanya) untuk menempatkan kotak/form komentar dibawah posting/artikel. Sebenarnya hal ini gampang-gampang susah artinye banyak yang gagal tapi tidak sedikit yang berhasil. Mau mencoba? Silahkan ikuti langkah dibawah ini...
Langkah 1
Login ke Blogger Draft disini
Langkah 2
Masuklah ke tab "Pengaturan" dan pilih tab "Komentar". Cari "Penempatan Formulir Komentar" ubahlah menjadi "Disemat di bawah entri", lihat gambar dibawah ini
Langkah 3
Simpan Setelan
Langkah 4
Masuklah ke tab "Tata Letak", pilih tab "Edit HTML" (jangan lupa Backup template terlebih dahulu)
Langkah 5
Aktifkan "Expand Template Widget"
Langkah 6
Cari kode dibawah ini :
<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</p>
Langkah 7
Gantilah/Replace kode diatas (Langkah 6) dengan kode dibawah ini :
<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>
Langkah 8
Simpanlah Template Blogger, semoga berhasil....:)
Subscribe to: Posts (Atom)

Popular Posts