Tampilkan postingan dengan label Trik Comments. Tampilkan semua postingan
Tampilkan postingan dengan label Trik Comments. Tampilkan semua postingan
3. Recent Post Blog Versi Text Stylist Dengan Fungsi Hover Mouse

3. Recent Post Blog Versi Text Stylist Dengan Fungsi Hover Mouse

Taukah anda bagaimana meningkatkan traffik page view? ya jawabannya adalah melalui widget recent post atau artikel terkait berdasarkan label. Rata rata pengunjung blog apalagi yang sedang mengembangkan penampilan blognya atau hanya sekedar mencari informasi akan berusaha mengotak-ngatik recent post blog anda demi mencari apa yang seharusnya dia dapatkan. Kali ini PB Blog kembali akan memberikan tips dan trik penambahan widget recent post pada blog untuk mencapai tujuan di atas.
Read More
Cara Memasang Facebook Comment Box Versi Responsive Terbaru

Cara Memasang Facebook Comment Box Versi Responsive Terbaru

Dengan memasang Box Komentar Facebook di blogger memungkinkan orang lain atau pengunjung blog dapat mengomentari konten blog Anda menggunakan dan memilih akun Facebook mereka. Sekaligus pengunjung tersebut dapat berbagi kepada teman-teman mereka di News Feed Facebook pengunjung mereka.
Penggunaan Facebook Comment Plugin dulunya memang masih standar, baru baru ini sekitar bulan Juni 2015, Facebook mengupdate facebook pluginnya dengan versi yang lebih Responsif sehingga memungkinkan pengguna blog dan pengunjung dapat melihat isi blog dengan waktu load yang cepat.

Read More
Style 4# Cara Menambahkan Emoticons Smiley Di Kolom Komentar Blogger

Style 4# Cara Menambahkan Emoticons Smiley Di Kolom Komentar Blogger

Untuk Style #4 ini akan masih hampir sama dengan Style #3 dengan konsep animatif, karena menggunakan kumpulan figur animasi emoticon.

Emoticon/smiley biasanya digunakan untuk menyatakan kondisi, senang, sedih, marah dll. Selain itu juga sebagai pemanis kolom komentar, sehingga tampak lebih hidup.

Read More
Style 2# Cara Menambahkan Emoticons Smiley Di Kolom Komentar Blogger

Style 2# Cara Menambahkan Emoticons Smiley Di Kolom Komentar Blogger

Untuk Style #2 ini akan lebih animatif, karena menggunakan extension Gif. Emoticon/smiley biasanya digunakan untuk menyatakan kondisi, senang, sedih, marah dll. Selain itu juga sebagai pemanis kolom komentar, sehingga tampak lebih hidup.

Langsung saja kita breakdown  Style #2, SIAP:

>>Style #2. Emoticon Gif Sesuai Simbol Ketikan Keyboard

Ada tiga langkah, untuk menambahkan emoticon yahoo pada threaded comment :

1. Penambahan kode CSS
2. Penambahan kode HTML
3. Penambahan JavaScript
Fig. Animated gif Emoticons Yahoo
Fig. Animated gif Emoticons
Hasil Emoticon Smiley Yahoo Gif




Sangat Penting : Sebelum melakukan pengeditan pada HTML Template Blog, masuk ke Template>>Cadangkan/Pulihkan, download template anda biar kalau ada kendala masih bisa mengembalikan format template sebelumnya atau gunakan fasilitas key CTRL + Z untuk Undo fungsi.

1. Penambahan kode CSS

Step 1>> Login ke Blogger Account


Step 2>> Masuk ke Template >>pilih Edit HTML

Step 3>> Cari kode ]]></b:skin>  dengan menekan CRTL + F pada keyboard

Step 4>> Tambahkan kode CSS di bawah ini tepat di atasnya kode ]]></b:skin>  

<!-- Yahoo Smileys Code Start-->
.ysmileykangismet {
    background: none repeat scroll 0 0 #EFF5FB !important;
    font-size: medium !important;
    padding: 10px !important;
    text-align: left !important;
    font-weight:bold !important;
    font-size:11px !important;
    margin-top:-35px;
}
img.bhacksmly {
    height: auto !important;
    vertical-align: middle !important;
    width: auto !important;
    border:0px !important;
}
<!-- Yahoo Smileys Code End-->

2. Penambahan kode HTML

Step 5>> Cari kode ini :



<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='threaded-comment-form'/>

Lalu copy dan pastekan kode di bawah ini tepat  di antara kedua kode di atas


<!-- Yahoo Smileys Start-->

<div class='ysmileykangismet'>

<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/> :)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/> :(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/> ;)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/> :D
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/> ;;-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/> :-/
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/> :x
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/> :P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/> :-*
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/> =((
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/> :-O
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/> X(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif'/> :7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif'/> B-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/17.gif'/> :-S
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif'/> #:-S
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/19.gif'/> 7:)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/>  :((
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/>  :))
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/> :|
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/23.gif'/> /:)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/> =))
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/25.gif'/> O:-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif'/> :-B
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/27.gif'/> =;
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/101.gif'/> :-c
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/>  :)]
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/> ~X(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/103.gif'/> :-h
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/> :-t
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/105.gif'/> 8-7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/28.gif'/> I-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> 8-|
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> L-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/31.gif'/> :-a
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/32.gif'/> :-$
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/33.gif'/> [-(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/34.gif'/> :O)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/> 8-}
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/36.gif'/> 2:-P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/37.gif'/> (:|
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/38.gif'/> =P~
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/39.gif'/>
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/40.gif'/> #-o
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/41.gif'/> =D7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/42.gif'/> :-SS
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/43.gif'/> @-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/44.gif'/> :^o
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/45.gif'/> :-w
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/47.gif'/> 7:P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/48.gif'/> 2):)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/109.gif'/> X_X
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/110.gif'/> :!!
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/111.gif'/> \m/
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif'/> :-q
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/113.gif'/> :-bd
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/114.gif'/> ^#(^
<img alt='' class='bhacksmly' src='http://l.yimg.com/a/i/us/msg/emoticons/pirate_2.gif'/> :ar!
</div>

<!-- Yahoo Smileys End-->

3. Penambahan kode Javascript

Step 6>> Cari kode ini </body>:


<!-- Yahoo Smileys Script --> <script src='http://kangismet.github.io/javascript/javascripts/ysmileythreaded.js' type='text/javascript'/> <!--Yahoo Smileys Script Ends -->

Lalu copy dan pastekan kode di bawah ini tepat  di atas kode </body>

Step 7>> Simpan Template
Read More
Kumpulan Cara Menambahkan Emoticons Smiley Di Kolom Komentar Blogger

Kumpulan Cara Menambahkan Emoticons Smiley Di Kolom Komentar Blogger

Costumize blogger kita lagi yuk.

Pada tutorial kali ini saya ingin berbagi cara menampilkan emoticons smiley pada komentar blogger. Dengan beberapa pilihan costumize saya berharap sobat blogger bia memilih cara menampilkan emoticon smaley sesuai selera. 
Dipencarian google anda akan menemukan banyak blog tutorial yang membahas cara menambahkan yahoo smiley emoticons pada komentar blogger tapi yang menggunakan konsep JQuery mungkin masih jarang. Ini adalah fasilitas emoticons otomatis yang dapat merubah simbol emo seperti :), :D, :P, menjadi sebuah gambar yang telah ditentukan. Semoga dengan trik ini threaded comments blog anda tampil lebih aktraktif.
Read More