Cara Buat/Pasang Fitur Emoticon/Smiley di Comment Blogger

emoticon/smiley blogger
Emoticon/smiley dapat mewakili ekspresi komentator blog. Selain itu, emoticon/smiley dapat lebih mempercantik  tampilan bagian komentar blog. Dengan menggunakan javascript, kita dapat melakukan hack untuk menambahkan fitur emoticon pada blog berplatform Blogger. Emoticon ini menggunakan basis perintah emoticon  Yahoo! yg telah kondang itu. Misalnya, ketika ingin menampilkan gambar emoticon senyum, digunakan perintah/menuliskan karakter :), dst. Di blogger, perintah tersebut dapat diadaptasi guna memunculkan tampilan gambar smiley/emoticon tertentu. Pada fitur emoticon komentar Blogger ini, saya menggunakan gambar-gambar berformat gif milik Yahoo! yg memiliki efek animatif (bergerak).
demo smiley/emoticon comment blogger

Cara Pasang/Buat Fitur Emoticon Pada Komentar Blogger

Jika sobat Blogger tertarik memasang fitur emoticon pada blog sobat, ikuti beberapa langkah pemasangannya. Pada intinya ada 3 poin langkah penting:
a. Memasang CSS yg mengatur tampilan emoticon.
b. Memasang kode HTML guna menampilkan preview emoticon/smiley di bagian atas kotak komentar. Fungsinya sebagai panduan pengunjung ketika hendak membuat emoticon pada komentar.
c. Memasang kode javascript, yg berfungsi mengconvert perintah menjadi gambar emoticon.

Berikut cara pemasangannya:
1. Masuk ke Design/Template > Edit HTML
2. Centang "Expand Widget Templates"
3. Copy paste kode CSS berikut di ATAS ]]></b:skin> (cari dg Ctrl + F):
.bukarahasiasmiley {background: none repeat scroll 0 0 #EFF5FB !important;font-size: small !important;padding: 5px !important;margin:auto !important;text-align: left !important;font-weight:bold !important;width:100% !important;-moz-background-clip: -moz-initial;-moz-background-origin: -moz-initial;-moz-background-inline-policy: -moz-initial;}
.bukarahasiasmiley span {padding-right: 3px !important;} 
img.brbsmly {height: auto !important;vertical-align: middle !important;width: auto !important;border:0px !important;}
Jika ingin ganti warna background, ganti #EFF5FB dengan kode warna lain.
4. Cari <b:if cond='data:post.embedCommentForm'>. Biasanya ada dua tag xml seperti itu, cari & pilih yg kedua, yaitu yg berpasangan dengan <b:include data='post' name='comment-form'/>.
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
5. Copy kode HTML berikut (klik select all & copy), letakkan di BAWAH/SETELAH <b:if cond='data:post.embedCommentForm'>.



6. Copy kode berikut & letakkan di atas </body>:
<script src='
https://sites.google.com/site/bukarahasiahost/blogger-comment-smileys/bukarahasiablogspot-ysmileys-bloggercomments.txt' type='text/javascript'></script>
7. Save template.
8. You are done!

Kini pengunjung n sobat dapat menggunakan emoticon/smiley di komentar blog sobat.
Have a nice Blogging.

mencuri adalah pekerjaan pengecut! © buka-rahasia.blogspot.com

Cara Buat/Pasang Fitur Emoticon/Smiley di Comment Blogger
Written by: Ahmad Khoirul Azmi
Thanks for reading! Suka dengan artikel ini? Please link back artikel ini dengan codedi bawah atau share dengan sharing buttons di atas. Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.

add a comment 100 Comment(s):

Reggy Zian Purnama said...

. pertamaaxx..
gan..
kalau bisa, request cara memasang yahoo emoticon otomatis di postingan.. :D
kalau di komentar saya juga sudah masang..

Ahmad Khoirul Azmee said...

okay, ditunggu saja dulu ya :)

Pinjal said...

Mas saya punya 1 pertanyaan , maaf aga jauh dari posting,,, mas kenapa pengindeksan artikel saya di search engine Nama blog: baru judul artikel posting.
Bagaimana cara menyeting agar Judul artikel | Nama blog. Thanks mas.. Q bookmark untuk jawabanya

Pabrik Tas Jinjing said...

Nice info gan, thanks ya.
Berkunjung ke website saya gan :)

Ahmad Khoirul Azmee said...

@pinjal:
silahkan lihat caranya langsung disini :
Cara Meletakkan Judul Posting di Depan Nama Blog

Goresan Online said...

Mas azme, maaf neh, saya newbie dan mau bertanya walaupun mungkin melenceng dr topic nya...

Sebelum punya blog d blogspot, saya punya blog d wordpress, tpi kemudian banned mgkn karena ada unsur iklan, akhirnya saya pindah ke blogspot deh, baru 1minggu yg lalu...
Setelah pindah, saya pun mulai optimalisasi seo ala newbie alias sekedarnya seperti meta tag, h1, dan keyword. Saya bc2 tnyta ada juga blog dofollow alias blog kita sendiri tpi isinya link k blog utama.
Saya pun mencoba membuat dofollow d edublogs.com dan tnyta memakai engine wordpress.
Blog itu isinya hanyalah rss dr blog utama sayan ga ada meta, ga ada submit url, ga ada berburu back link, pokoknya benar2 blog abal2 lha isinya hanya rss, itupun judul.
Usianya 3 hari lebih muda dr blog utama saya, pertanyaannya, ketika saya ketik keyword + nama blog saya (coba2 gt) eh kok tuh blog dudul di edublog yg sering muncul??? Blog saya malah ga muncul blas :(
Sudah sering saya bc bahwa wordpress memang lebih handal, tpi knpa blogspot yg notabenya punya google malah dudul gt sih? Intinya kenapa blogspot begitu lemah untuk terindeks???
Sumpah frustasi ane, kudu d apain sih blog d blogspot nya :(
Trims sebelumnya

Pinjal said...

Ahmad Khoirul Azmee@ thanks pak masbrooooo hehe
Goresan Online@ hahaa sama gw juga 7 hari g ter indexs. Intinya sabar aja. Sampai saya juga bkin 2 blog di blogspot ehh setelah seminggu malah ke indekks semua.wordpress kurang di seo. Masih bagusan blogspotttt jauh.

tikus part II said...

mantap kak,. :D

Satriya said...

thanx gan....ane newbie
ijin sdot ilmu gan....

slahkan brkunjung gan...

tutur said...

terima kasih, saya ijin memasang ya.

ArhyErna_Blog said...

thank's gan... ane izin pakai yach untuk blog ane...oia sob apa saja yang perluuntuk blogq dan pa yang bagus untuk blog ane gan...!!!! tolong mampir diblogq... apa meta tangnya dah benar atau blum trus yang mw ditambah dan dikurangi atau da tawaran template untuk blog ane gan,,,,, asal tempaltnya headernya blogq bisa dipasang...!!!maaf merepotkan gan...!!!! selamat tahun baru 2012 sukses selalu gan...!!11

Donny Prasetyo said...

mas kenalin saya doni ..
mau tanya .. gimana caranya buat supaya ada backlink di bawah komentar yang ada di bawah icon home di bawah itu ? makasi

Ahmad Khoirul Azmi said...

@doni: klik aja keduanya. setelah masuk ke masing2 website copy code di website tersebut, kemudian masukkan ke HTML/Javascript, melalui add gadget/tambah gadet, lalu save.

puisi-zuwaily said...

keren... banyak belajar dari blog ini... trims atas tutor yg sangat bermanfaat bagi sy yang newbie ini y kang... sukses selalu...

photoshop said...

makasi buat infonya sob..thakns

Panduan Blogspot said...

thx sob atas tutorialnya,,,,,,,,,

@erwincobain said...

makasih yoo.............

Just Copy and Leave it !! said...

article bagus niih .
Numpang copast om,

wistaria ika putri said...

maaf, smilex sdh saya psg sesuai tutorial di atas, tapi beberapa smile yang diketiikkan tdk berubah menjadi icon... itu gmn ya...??

wistaria ika putri said...

:7 B-) :-S #:-S 7 O:-) :-B =; :-c :-h 8-7 I-) 8-| L-) :-a :-$ [-( :O) 2:-P =P~ :-? #-o =D7 :-SS @-) :^o :-w 7 X :!! \m/ :-q :-bd ^#(^ :ar!
icon2 tsb tdk muncul..

Oqif said...

Nice Info... mau tanya kenapa kadang setiap edit html maka akan ada tulisan seperti ini :Template Anda tidak dapat diparse karena tidak well-formed. Harap pastikan bahwa semua elemen XML ditutup dengan benar.
Pesan error XML: The element type "b:if" must be terminated by the matching end-tag "".?

asalasah said...

Oh yeesss.. Alhamdulillah saya bisa.. Trimakasih yaaa infonya :D

TIMON ADIYOSO said...

Tuker Link Mas http://timonadiyoso.blogspot.com/2011/12/link-exchange-tuker-link.html

Anonymous said...

koq gK muncul mas code nya waktu aku ketik

thank's

kunjungi blogku : http://bacozt-ant22.blogspot.com/

Ahmad Khoirul Azmi said...

Saya cek semua smiley yg dibuat sobat2 dari berbagai browser bisa semua, problemnya mungkin dari jenis operator sobat yg tidak mengijinkan load dari sites.google.com, oleh karena itu silahkan file js nya diupload sendiri ke hosting lain.

Alam Perwira said...

like this.. mancaaaaap..!! thanks gan..!! :)

nkha emely herf said...

like

ichallan said...

thanks gan infonya.. :)

dp-media said...

Thank's Gan....udah bisa.....

error community said...

woowwwww kereeeennn,,,,, KUNJUNG BALIK yaaaa :)
kerennn,, makasih banyak :)

VinoRoes said...

gimna caraNya sumpah ga nger :D
pemula

marloysa said...

Udah dicobain ga bisa gan di templete saya padahal udah copy paste semua :(. coba liat aja http://marloysa.blogspot.com
Mohon di bantu

Aswidha Fazani said...

thanks gan :D

Deny said...

udah saya pasang gan, sukses :)
makasih buat infonya gan, semoga lebih bermanfaat, saya tunggu postingan selanjutnya
saya ijin pasang scriptnya gan ?

|_IkhSan`SmAckLaw_| said...

ijin sedot mas!!! jalan" lah ke blog ane www.ikhsansangpenakluk.blogspot.com

|_IkhSan`SmAckLaw_| said...

gk bisa mas

John Smith said...

buat yg masih bermasalah dgn emoticon, silahkan kunjungi blog ane, insyaallah bisa bakal teratasi masalah ente. Salam kenal buat semua, terutama buat yg punya blog, moga sehat selalu dan blognya tambah rame terus. :D

Olland Putra said...

maksh gan atas info-infonya... :)

Coretan-Coretan Maut Rizal said...

Sobh, nggak rubah carakternya ke gambar sobh... Mohon bantuannya... :(

Rosyd Aqbar said...

Nice tutorial Bang,
Saya selalu setia mengunjungi Blog ini.
Tutorialnya mantep2

Riki mahendra said...

aku udah muncul contoh nya di atas komen blog ku tapi pas di coba kok gak bisa???

Miftah said...

makasih atas informasinya, menarik..

Info Toko Surya62 said...

Wah kok gak bisa Bos, maksudku gak nongol gambare yo, ada apakah gerangan?

Vi_Ber is My Blog said...

kok punya saya ga da kode
nya ya gan?

mayya said...

kalo buat wordpress gimane ye? kan dia g mau dipasang yg berjava script gitu

Pengetahuan said...

kok punyaku kalo diketik ga muncul emotnya ya?? plis pencerahannya :) :) :)

Adk_Ozi|GM™ said...

follow gan http://oziecyber.blogspot.com/

Oky Trilupito said...

nice info gan.. thanks.. :D

Guide For You said...

Mas, ini dijamin bisa gax ya ??, coz aq sring nyobain ini tapi gx brhasil

Jasmine's BLOG said...

jadi pengen coba nih...
makasih mas

Ip BLOG said...

Trimakasih, infonya sangat berguna..

zeearta said...

thx infonya :)

M . Hilmy Faza said...

thank you gan atas info dan tips-nya

Alip Ilap Via Lova said...

kok diblog saya ngga bisa yaa...
emotionnya udah nampil tapi kalo saya coba berkomentar kok ngga bisa jadi gambarnya...???

HOMESICK said...

kok udah saya coba ga bisa ya gan ? knp yach..

eko Yulianto said...

udah saya coba dan berhasil misalnya :) kenapa nggak keluar smilleynya

andi hasmiati said...

thanks informasinya ya...

andi fajar said...

waahh it's work gan..muncul iconnya..lucu2..thanks buat share ilmunya gan..

www.alisaartshop.blogspot.com

Aksesoris Sparepart Motor said...

Tutorial mantab! Thanks gan!

mbah cepy said...

udah bisa di pasang, makasih gan...

Santo Chijoho said...

wahhh ko gk muncul ya mas :(

http://www.chijoho.com

Ditzz 77 said...

wah,thanks gan,gmbar nya dh muncul...

bloger anwar said...

mantab bro,
minta kunjungannya
http://blo99-er.blogspot.com

Sii kakamania said...

Ajiiib gan silahkan kunjungi gubuk saya siikakamania.blogspot.com

VALENTINO said...

bang dah berhasil tapi saya coba di komentar gk muncul emoticonnya mohon pencerahannya thanks

wirawan muhammad said...

:)

Backwall said...

Sudah saya aplikasikan di blog. Trims.

alfa sayyidah said...

makasi banyak :D

John Smith said...

Emoticon ga mau nongol? Codenya eror? Atau masalah lain? Promosi, dijamin 100% nongol emoticonnya. Baca yg ini gan: Cara Pasang Emoticon Yg Baik Dan Benar

Buat yg agan yg empunya blog, tolong post ini jangan dimasukin ke tong spam ya. Kasihanilah diriku ini sedikit saja. Cuman minta backlink doang kok, bukan duit. :)

Timothy Stefan said...

KEREN GAN!!

Dody 17 said...

makasih banyak infonya , izin copas yaa...

Agah Jaisyulhaq said...

Hebat..

Amirullah Zmart said...

ijin copas eaa :)

Hideki Ryuuga said...

ijin copas ya gan, dan kunjungi http://www.qiqialone.co.cc/

anak baik said...

hebat artikelnya

Danang Sigit said...

:) test comment

Mang uem said...

thanks sudah berbagi ilmunya...sukses selalu..

Blogger Jepara said...

Gan Azmi saya sudah nyoba pasang kode html'nya dai blog ane tapi kok masih belum bisa buat komen?? padahal pilihan emotnya sudah ada. Apa memang nggak bisa di pasang pada template bawaan blogger atau saya yang salah?? tolong pencerahannya.

Thedragao Blog said...

thanks gan.....

izin sedot tapi ane kasih sumbernya...]

ane newbi

Tax Consultant said...

Bikin berat web gak ya?

Jony Petrucci said...

kok di posting yang kedua emotionnya gak muncul gan?
: )

Ahmad Budairi said...

Wah, maksih infonya.

yusuf ardhi kusumah said...

ijin copas ya gan?
makasih

Acep Derby Yudha Anggara said...

bagus banget om infonya. saya juga mw pasang lah :)

http://acep-computer-science.blogspot.com/

dudi-suswandi.blogspot.com said...

terima kasih atas ilmu yang bermanfaat ini..sukses selalu

wijaya rizky said...

trima kash buat info'a
oia gan,klau kbnykn widget di blog google bkalan gk suka ya sma blog itu??

Ma Qindy said...

Makasii banget ya.. blog ini sangat membantu blog ku banget.. makasii banyak :D

A.N.K. said...

info yg sangat bagus dan sangat bermanfaat bagi blog saya,,, saya harap agan mau berkunjung balik ke blog saya www.ankurniawan.blogspot.com

asep iwan said...

mau nanya mas, ko emoticon gambar komentar ga tampil? lihat di blogku mas www.new-satelit.com dan coba berkomentar mas,, makasih...

Maha Putra Rusydinal said...

keren mas, gimana ya mas cara buat kode sendiri seperti mas buat kode script emoticon komentar ini ? ? ? mohon bantuannya , terima kasih.

joe memang said...

Gx bisa mas...

Silahkan CEK BLOG saya...

www.joememang.blogspot.com

cherylaghniads said...

salam kenal mas bro, btw mas bro nda pasang emoticonnya ya? apa mungkin ada pengaruh negatifnya pada blog kalo kita pasang emoticon ini mas bro? kalo ada tolong share juga ya mas bro, maklum saya nubie masih cari-cari info dan trik untuk mempercantik blog saya. trims mas bro.

Ahmad Khoirul Azmi said...

Halo, salam kenal.
Kalo saya memberikan tips dan trik, bukan berarti saya pribadi harus menerapkan semuanya, tapi berdasarkan kebutuhan dan keinginan. Nah, ini salah satu yang saya sediakan bagi yang pengen saja.
Pengaruh loading blog sebenarnya tidak hanya karena satu widget tapi kombinasinya. Kalo anda sudah memasang banyak widget berat, kemudian ditambah lagi, tentu akan lebih berat. Kalo pengaruh negatif, satu-satunya ya loading blog. Jadi sebelum pasang widget semacam ini, silahkan cek dulu apakah dengan menambahkannya bersama-sama dengan widget yang sudah ada memperberat apa tidak. Kalo iya kurangi yang tidak penting, atau lepas smileynya.

Biodata Gua said...

Salam kenal, mas saya punya 1 pertanyaan, tapi ini jauh dari posting,..

jika kita sudah download template, nah terus, aku buka filenya, terus gimana lagi...

di tunggu jawabbannya mas,, mksih...

Ahmad Khoirul Azmi said...

masuk ke dashboard > template > klik backup/restore > upload file xml. Kalo masih dalam bentuk zip ekstrak dulu dan cari file xml-nya. Sebelum upload template backup template lama dulu untuk berjaga2.

Ambalan Alwathoniyah Asshodriyah 9 Jakarta said...

ijin pasang yah :)

Melissa Emerson said...

kok aku gak bisa pasangnya mas.. :(

hackerparkour.com said...

preview di bagian atas kotak komentar sudah muncul. tapi saya coba komen perintahnya kok tidak berubah menjadi gambar emoticon ??

mohon bantuannya suhu :)

hackerparkour.com said...

preview di bagian atas kotak komentar sudah muncul. tapi saya coba komen perintahnya kok tidak berubah menjadi gambar emoticon ??

mohon bantuannya suhu :)

Rubi Jihantoro said...

(y)

Post a Comment

Silahkan tinggalkan komentar untuk respon/pertanyaan. Jika ingin menuliskan kode di dalam komentar, convert dulu dengan HTML Encoder. Centang "Notify me" untuk mengetahui balasannya. Maaf apabila komentar dibalas dalam waktu lama atau tidak terbalas karena saya tidak online setiap hari. Atau biar lebih cepat dan enakan bisa kontak lewat Facebook. KOMENTAR BERISI LINK & tidak sesuai dengan Comment Policy akan langsung dihapus.Karena banyaknya spam, komentar sekarang di-moderasi sebelum diterbitkan. Thanks.
Smashed Spams: 11362

Recent Comments

Tautweb.com

  • Menulis Artikel Blog

    Tips dan panduan menulis artikel blog berkualitas dan menarik (dalam beberapa seri).

  • Template Blog Terbaik

    Review dan daftar situs pembuat dan penyedia template blogger berkualitas dan tentunya terbaik.

  • Strategi SEO 2015

    Hal apa saja yang wajib menjadi bagian dari strategi SEO di tahun ini? Simak ulasan lengkapnya di sini.

  • Artikel SEO Friendly

    Tips membuat artikel yang memenuhi syarat SEO sekaligus tetap menjaga kualitasnya.

  • Belajar HTML & CSS

    5 situs rekomendasi untuk mempelajari HTML dan CSS dari tingkat dasar.

© 2010-2015 Buka Rahasia Blogspot | Template by Dicas Blogger | Modified & Enhanced by Ahmad Khoirul Azmi

 ContactPrivacy PolicyComment PolicySitemap