Sudah pernah mengisi komentar di AaGen Blog...? Bosen dengan tampilan komentar dari biasanya...?
Jika kamu merasakan hal yang sama, sudah saatnya untuk merubah tampilan komentar supaya lebih cantik nan apik dilihat. Banyak cara untuk merubah tampilan komentar yang menawan, salah satunya dengan memasukkan ikon - ikon lucu (emoticon) pada komentar di setiap artikel yang ada di blog kamu. Dengan ikon - ikon yang menghiasi komentar, menjadikan blogmu sering dikunjungi oleh teman - teman sesama netter / blogger. Tapi bagaimana caranya agar ikon - ikon tersebut dapat terlihat oleh pembaca...? Simak terus artikel ini karena saya akan berikan triknya untuk kamu semua. (hanya untuk pemula dalam dunia blogging)....
Agar proses dalam menjalankan trik ini tidak bingung di tengah jalan, pastikan terlebih dahulu template yang kamu pakai, apakah template biasa (bawaan blogger atau tidak dimodifikasi) atau template yang sudah dimodifikasi sana sini (AaGen Blog termasuk template yang dimodifikasi). Walaupun ada perbedaan sedikit pada kode javascript yang dimasukkan, tetapi kedua jenis template tersebut saya jamin bisa diterapkan.
Jika sudah dipastikan templatenya, silahkan ikuti langkah - langkah berikut :
# Login ke blogmu
# Masuk ke menu Layout > Edit HTML
# Berikan tanda Centang pada "Expand Widget Templates"
# Silahkan cari kode < /body > pada templatemu (gunakan ctrl+f pada keyboard)
# Letakkan kode dibawah ini tepat diatasnya :
<div style='overflow:auto; width:100%px; height:150px; padding:0px 0px 0px 0px; border:0px solid #CCCCCC; margin: 0px 0px 0px 0px;'>
<center><b><font color='blue' face='arial' size='2'>
<img border='0' src='http://img7.imageshack.us/img7/5660/pinginbelajar1.gif'/>:a:
<img border='0' src='http://img162.imageshack.us/img162/9828/pinginbelajar2.gif'/>:b:
<img border='0' src='http://img338.imageshack.us/img338/2876/pinginbelajar5.gif'/>:c;
<img border='0' src='http://img178.imageshack.us/img178/4784/pinginbelajar6.gif'/>:d:
<img border='0' src='http://img15.imageshack.us/img15/5646/pinginbelajar7.gif'/>:e:
<img border='0' src='http://img54.imageshack.us/img54/9709/pinginbelajar8.gif'/>:f:
<img border='0' src='http://img228.imageshack.us/img228/2490/pinginbelajar9.gif'/>:g:
<img border='0' src='http://img254.imageshack.us/img254/9241/pinginbelajar10.gif'/>:h:
<img border='0' src='http://img3.imageshack.us/img3/9077/pinginbelajar26.gif'/>:i:
<img border='0' src='http://img249.imageshack.us/img249/5254/pinginbelajar27.gif'/>:j:
<img border='0' src='http://img53.imageshack.us/img53/61/pinginbelajar33.gif'/>:k:
<img border='0' src='http://img186.imageshack.us/img186/7215/pinginbelajar35.gif'/>:l:
<img border='0' src='http://img106.imageshack.us/img106/7729/pinginbelajar36.gif'/>:m:
<img border='0' src='http://img106.imageshack.us/img106/700/pinginbelajar17.gif'/>:n:
<img border='0' src='http://img231.imageshack.us/img231/4497/pinginbelajar34.gif'/>:o:
<img border='0' src='http://img4.imageshack.us/img4/1805/pinginbelajar31.gif'/>:p:
<img border='0' src='http://img72.imageshack.us/img72/7403/pinginbelajar30.gif'/>:q:
<img border='0' src='http://img249.imageshack.us/img249/5619/pinginbelajar22.gif'/>:r:
<img border='0' src='http://img249.imageshack.us/img249/9919/pinginbelajar15.gif'/>:s:
<img border='0' src='http://img254.imageshack.us/img254/9607/pinginbelajar14.gif'/>:t:
<img border='0' src='http://img19.imageshack.us/img19/6241/pinginbelajar13.gif'/>:u:
<img border='0' src='http://img19.imageshack.us/img19/2213/pinginbelajar12.gif'/>:v:
<img border='0' src='http://img249.imageshack.us/img249/2448/pinginbelajar11.gif'/>:x:
</font></b></center>
</div>
# Save Template
Untuk langkah - langkahnya sama saja, hanya kode javascriptnya saja beda yang diletakkan di atas < /body > adalah :
Bagi rekan blogger yang ingin mengubah kode javascriptnya, silahkan didownload disini :
Agar proses dalam menjalankan trik ini tidak bingung di tengah jalan, pastikan terlebih dahulu template yang kamu pakai, apakah template biasa (bawaan blogger atau tidak dimodifikasi) atau template yang sudah dimodifikasi sana sini (AaGen Blog termasuk template yang dimodifikasi). Walaupun ada perbedaan sedikit pada kode javascript yang dimasukkan, tetapi kedua jenis template tersebut saya jamin bisa diterapkan.
Jika sudah dipastikan templatenya, silahkan ikuti langkah - langkah berikut :
# Login ke blogmu
# Masuk ke menu Layout > Edit HTML
# Berikan tanda Centang pada "Expand Widget Templates"
# Silahkan cari kode < /body > pada templatemu (gunakan ctrl+f pada keyboard)
# Letakkan kode dibawah ini tepat diatasnya :
<script src='http://aagenblog.host56.com/scriptblog/emoticon_biasa.js' type='text/javascript'/>
# Kemudian cari kode <b:if cond='data:post.embedCommentForm'> pada templatemu
# Silahkan letakkan script dibawah ini tepat diatasnya :<div style='overflow:auto; width:100%px; height:150px; padding:0px 0px 0px 0px; border:0px solid #CCCCCC; margin: 0px 0px 0px 0px;'>
<center><b><font color='blue' face='arial' size='2'>
<img border='0' src='http://img7.imageshack.us/img7/5660/pinginbelajar1.gif'/>:a:
<img border='0' src='http://img162.imageshack.us/img162/9828/pinginbelajar2.gif'/>:b:
<img border='0' src='http://img338.imageshack.us/img338/2876/pinginbelajar5.gif'/>:c;
<img border='0' src='http://img178.imageshack.us/img178/4784/pinginbelajar6.gif'/>:d:
<img border='0' src='http://img15.imageshack.us/img15/5646/pinginbelajar7.gif'/>:e:
<img border='0' src='http://img54.imageshack.us/img54/9709/pinginbelajar8.gif'/>:f:
<img border='0' src='http://img228.imageshack.us/img228/2490/pinginbelajar9.gif'/>:g:
<img border='0' src='http://img254.imageshack.us/img254/9241/pinginbelajar10.gif'/>:h:
<img border='0' src='http://img3.imageshack.us/img3/9077/pinginbelajar26.gif'/>:i:
<img border='0' src='http://img249.imageshack.us/img249/5254/pinginbelajar27.gif'/>:j:
<img border='0' src='http://img53.imageshack.us/img53/61/pinginbelajar33.gif'/>:k:
<img border='0' src='http://img186.imageshack.us/img186/7215/pinginbelajar35.gif'/>:l:
<img border='0' src='http://img106.imageshack.us/img106/7729/pinginbelajar36.gif'/>:m:
<img border='0' src='http://img106.imageshack.us/img106/700/pinginbelajar17.gif'/>:n:
<img border='0' src='http://img231.imageshack.us/img231/4497/pinginbelajar34.gif'/>:o:
<img border='0' src='http://img4.imageshack.us/img4/1805/pinginbelajar31.gif'/>:p:
<img border='0' src='http://img72.imageshack.us/img72/7403/pinginbelajar30.gif'/>:q:
<img border='0' src='http://img249.imageshack.us/img249/5619/pinginbelajar22.gif'/>:r:
<img border='0' src='http://img249.imageshack.us/img249/9919/pinginbelajar15.gif'/>:s:
<img border='0' src='http://img254.imageshack.us/img254/9607/pinginbelajar14.gif'/>:t:
<img border='0' src='http://img19.imageshack.us/img19/6241/pinginbelajar13.gif'/>:u:
<img border='0' src='http://img19.imageshack.us/img19/2213/pinginbelajar12.gif'/>:v:
<img border='0' src='http://img249.imageshack.us/img249/2448/pinginbelajar11.gif'/>:x:
</font></b></center>
</div>
# Save Template
Untuk langkah - langkahnya sama saja, hanya kode javascriptnya saja beda yang diletakkan di atas < /body > adalah :
<script src='http://aagenblog.host56.com/scriptblog/emoticon_aagenblog.js' type='text/javascript'/>
Bagi rekan blogger yang ingin mengubah kode javascriptnya, silahkan didownload disini :
Javascript untuk Template Biasa
JavaScript untuk Template Modifikasi
JavaScript untuk Template Modifikasi
Semoga trik diatas bermanfaat buat semua....Selamat Mencoba ya...
8 comments:
:i:
saya suka blogger seperti anda, penuh dengan kreatif, rajin ngutak-ngatik script, teruslah berkarya dan mau berbagi tentunya. trims
test ach.. :g: :a:
:g:
:c:
terimakasih
:i:
yihaaaaaaaa
makasih banyak infonya..saya coba deh di blogku
thankss brooo infonyaa http://img3.imageshack.us/img3/9077/pinginbelajar26.gif
terima kasih buat share ilmunya. hanya saja terkadang saya pernah mencobanya dengan memasang kode tersebut pada kotak komentar. namun tidak bisa terbaca, kenapa ya? justru hanya kode nya saja yang terlihat :a:
Post a Comment