Ucapan Terima Kasih Untuk Komentar Dengan Hover

Ucapan Terima Kasih Untuk Komentar Dengan Hover

Bola Hero Gawai

Ucapan Terima Kasih Untuk Komentar Dengan Hover

Ucapan Terima Kasih Untuk Komentar
Sebelumnya saya sudah pernah mempostingan cara membuat pesan komentar yang kita letakan di bawah editor komentar blog. Nah kali ini kita akan membuat pesan komentar atau ucapan terima kasih untuk komentar dengan menambahkan efek hover.


Ucapan terima kasih ini tidak akan tampak sebelum pengunjung atau komentator meng-hover comment-form. Ketika pengunjung atau komentator meng-hover comment-form, maka ucapan terima kasih ini akan muncul di atas editor komentar dengan slide dari kiri ke kanan.


Bagi yang tertarik untuk mencobanya, silahkan copy kode-kode di bawah ini.

Kode CSS


.comment_thanks{background:#4D90F0;color:#fff;padding:5px 8px;position:absolute;right:300px;top:-6px;opacity:0;transition:all .4s ease-in-out;z-index:999;font-size:12px;font-weight:700;border-radius:2px;border:1px solid #3079ED}
.comment-form:hover .comment_thanks{opacity:1;right:0}
.comment_thanks_box{position:relative}

Langkah 1: Silahkan cari kode di bawah ini


<b:includable id='comment-form' var='post'>

Di bawah kode tadi terdapat 2 buah kode seperti di bawah ini


<data:blogTeamBlogMessage/>

Maka simpan kode di bawah ini tepat di atas kode <data:blogTeamBlogMessage/> yang kedua.


<div class='comment_thanks_box'>
<span class='comment_thanks'>Terima Kasih Sudah Berkomentar</span>
</div>

Langkah 2: Kemudian cari juga kode seperti di bawah ini


<b:includable id='threaded-comment-form' var='post'>

Dan silahkan lakukan seperti langkah 1 di atas kemudian SAVE template dan selesai. Sekarang silahkan cek di postingan blog dengan meng-hover area comment-form.

Share this:

Share this with short URL: Get Short URL loading short url

You Might Also Like:

Disqus
Blogger
Pilih Sistem Komentar Yang Disukai

32 Comments Add Comment

Menarik Kang, langsung psang aj nch kayaknya...

Balas

ganti akhhh...yg ini menarik
thanks mas

Balas

selalu ajah membuat saya terkesan dengan suguhannya, kali ini tentang ucapan terimakasih yang hahay banget, dan layak banget untuk dipasang, sebagai tanda kalo kita ini admin blog yang ramah tamah dan murah senyum...nuhun ah

Balas

gak jadi di template ku mas....=(
coba cek

Balas

eh sudah jadi mas,tadi bingung dilangkah ke 2.
soalnya mas adhy tidak menjelaskan diatas :)

Balas

Silahkan mas Gunawan :)

Balas

Sudah saya cek sudah OK mas :)

Balas

Dan saya selalu tersenyum jika membaca komentarnya Mamang Lembu :)

Balas

mantab mas,, udah aku terapin di blog ku,, makasih,, :)

Balas

makin stylist aja nih kalo blog ditambahin kaya gini ya :D

Balas

Sudah saya cek tambah OK mas :)

Balas

Hehehee silahkan dicoba kang :)

Balas

Menarik nih kang, tp naha teu acan ge ngomen tos aya ucapan terimakasih ???

Balas

ini blognya mas adhy di modify lagi ya :) tambah keren ajah, oh ya itu maksud donasi buat anak mas adhy yg kecelakaan ya? belum sembuh? =(

Balas

hehehee iya kang... nanti untuk selanjutnya saya modif lagi buat komentar terbarunya :)

Balas

Itu toggle mas :) coba aja klik... biasa mas kutak-katik kode, sekalian aja dipasang hehehe

Balas

hehehe,,, terima kasih sudah mampir di blogku mas :)
tapi maaf mas, ada satu lagi yg mau aku tanyakan , gimana caranya agar kotak ucapan tadi letaknya jadi di bawah toggle daftar emoticon?? , jadi saat toggle daftar emoticon dibuka kotak ucapan tadi bisa di bawah daftar emoticon, jadi nggak nutupin kodenya gitu.. mohon bantannya mas :)

Balas

ijin simpan kang... )

Balas

Wah keren Kang, punya sayah Ucapan Terimakasih nya blm di update nich masih veri yang lama he....

Balas

ditunggu kang anu fix na nyaa?hehe

Balas

Silahkan mas Ade :)

Balas

Silahkan diupdate dulu atuh kang hehehehe :)

Balas

Coba yang class="comment_emo_list" di beri margin-top biar emo list nya turun ke bawah misalnya seperti ini <div class="comment_emo_list" style="margin-top:15px">

Balas

mas kok punya saya ga jadi ya?

Balas

Mungkin langkah kedua kelewat mas :) buat langkah kedua seperti langkah pertama :)

Balas

sudah mas silahkan di cek hasilbolaku blogspot com

Balas

tulisannya malah terletak d bawah mas.

Balas

Oh itu pakai threaded comment blogger ya mas? Saya kira pakai threaded comment hack, itu karena comment-form nya jatuh ke bawah. Coba gunakan trik agar comment-form atau pesan komentar selalu ada di atas editor komentar. Atau coba cari kode class="comment-replybox-thread" simpan di bawahnya.

Balas

itu gmna ya mas? iya mas. bagusan komment hack atau blogger mas?

Balas

Trik agar comment-form atau pesan komentar selalu ada di atas editor komentar udah banyak di Google, coba aja searching.
Jika ingin halaman postingannya tidak banyak error di validasi html5 coba pakai threaded comment hack, ada di kang Ismet.

Balas

udah aku coba nggak bisa mas,, malah emo list & kotak ucapannya sama2 turun.. :(

Balas

mantap gan tutorial nya makasih :)

Balas
Add Comment

Komentar dengan link promo akan masuk spam.

Gunakan konversi tool jika ingin menyertakan kode atau gambar.


image
How to style text in Disqus comments Top Disqus Commentators
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Box

How to get ID DISQUS - http://disq.us/p/[ID DISQUS] - lihat di sini

strong em u strike
pre code pre code spoiler
embed

Like Kompi Ajaib? Keep us running by whitelisting Kompi Ajaib in your ad blocker.

This is how to whitelisting Kompi Ajaib in your ad blocker.

Thank you!

×
×
×