Sunday, April 21, 2013

Cara Membuat Buka Tutup Komentar dengan jquery pada Blog







Agar terlihat simple, komentar yang ada di setiap postingan di buat buka tutup.


Selain rapi, blog juga tidak berat di loading.


Caranya:





1. Login Blog


2. Edit template


3. Pasang kode dibawah ini diatas ]]></b:skin>





a.openpanel {color:#fff;display:block;width:100%;height:40px;padding:0px 0px;text-align:center;font-weight:bold;line-height:30px;background:#282828; url()repeat-x;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;position:relative;}


a.openpanel em {width:0px;height:0px;display:block;position:absolute;top:15px; right:15px;border:6px solid transparent;border-top-color:white;}


a.openpanel.active {background-color:#282828;}


a.openpanel.active em {top:6px;border color:#222222;}


div.paneline {height:0px;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;}


div.hienzoPanel {padding:10px 20px 20px;margin:0px 0px !important;}



4. Letakkan script di bawah ini, di atas </head>



<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>


    <script type='text/javascript'>


    //<![CDATA[


    var panelSelector = '#comments',


    openPanelText = "Comment Here",


    closePanelText = "Close Comment",


    slideDownPanelSpeed = 600,


    slideUpPanelSpeed = 400;


    //]]>


    </script>


    <script type='text/javascript'>


    </script>


    <script src='http://mig33eaglecomment.googlecode.com/files/show-hide-mig33eagle.js.txt' type='text/javascript'/>






5. Simpan template dan selesai





Demikian Cara Membuat Buka Tutup Komentar pada Blog.


Semoga bermanfaat




Labels:

Tuesday, September 18, 2012

Cara Memperlebar Kotak Komentar Sesuai Lebar Postingan Blog



Jika sobat ingin menyamakan lebar postingan sama dengan lebar kotak komentar.
Agar post blog 1 paket betah banget untuk di simak.
Berikut ini caranya:


1. Login blog
2. Rancangan
3. Edit html dan centang expand widget template
4. Cari kode 
 <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>


dan ganti lebar kotak komentar width=lebar main wrapper blog sobat.
misal main-wrapper sobat width:540
maka kodenya menjadi berikut:


 <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='540'/>
4. Simpan template dan silahkan sobat lihat hasilnya.


Semoga info tentang Cara Memperlebar Kotak Komentar Sesuai Lebar Postingan Blog
bermanfaat.

Labels:

Monday, September 3, 2012

Cara Memasang emoticon Tuzki Rabbit di Komentar Blog



Posting yang saya share kemarin hari adalah cara memasang emoticon naruto di komentar blog.
Kalin ini saya share bagaimana cara memasang emoticon tuzki rabbit di kotak komentar.
Contoh emoticonnya seperti dibawah ini sob.


:a::b::c::d::e::f

::g::h::i::j::k

::l::m::n:


Yuk langsung aja ke caranya:
1. Login Blog sobat
2. Rancangan
3. Edit html dan centang "expand widget template"
4. Tempatkan kode berikut di atas </body>
<script src='http://cybermigtuzkirabbit.googlecode.com/files/tuzkirabbit.js' type='text/javascript'/>
5. Letakkan kode berikut di bawah <p class='comment-footer'>
atau
diatas kode <b:if cond='data:post.embedCommentForm'>


<img src='http://www.smileycodes.info/emo/tuzki/86.gif'/>
:a:
<img src='http://www.smileycodes.info/emo/tuzki/118.gif'/>
:b:
<img src='http://www.smileycodes.info/emo/tuzki/158.gif'/>
:c:
<img src='http://www.smileycodes.info/emo/tuzki/124.gif'/>
:d:
<img src='http://www.smileycodes.info/emo/tuzki/115.gif'/>
:e:
<img src='http://www.smileycodes.info/emo/tuzki/3.gif'/>
:f:
<img src='http://www.smileycodes.info/emo/tuzki/137.gif'/>
:g:
<img src='http://www.smileycodes.info/emo/tuzki/94.gif'/>
:h:
<img src='http://www.smileycodes.info/emo/tuzki/81.gif'/>
:i:
<img src='http://www.smileycodes.info/emo/tuzki/61.gif'/>
:j:
<img src='http://www.smileycodes.info/emo/tuzki/76.gif'/>
:k:
<img src='http://www.smileycodes.info/emo/tuzki/14.gif'/>
:l:
<img src='http://www.smileycodes.info/emo/tuzki/136.gif'/>
:m:
<img src='http://www.smileycodes.info/emo/tuzki/126.gif'/>
:n:
6. Simpan template


Catatan:
Jika emoticon tidak muncul maka template sobat yang tidak support emoticon yang
di pasang di atas kotak komentar.
So saran saya jika sobat ingin memasangnya, ganti template aja.


Demikian cara memasang emoticon tuzki rabbit di komentar blog.
Semoga infonya bermanfaat.


Labels:

Saturday, August 25, 2012

Cara Memasang Emoticon Naruto pada Komentar Blog



Bagi penggemar naruto, neh saya bagi tutorial cara memasang emoticon naruto 
pada kotak komentar blog.
Kalau hanya emoticon yahoo yang sangat banyak beredar tutorialnya di blog tips, tentunya sudah bosen yaa.


Contoh emoticonnya:
:a::b::c::d::e::f:

:g::h::i::j::k:

:l::m::n:



Okey deh langsung simak langkah2nya:


1. Login Blog
2. Rancangan dan edit HTML
3. Centang "expand widget template"
4. Letakkan kode berikut diatas </body>
<script src='http://cybermignaruto.googlecode.com/files/naruto.js' type='text/javascript'/>
5. Letakkan kode berikut di bawah <p class='comment-footer'>
atau
diatas kode <b:if cond='data:post.embedCommentForm'>
<img src='http://www.emotasia.com/wp-content/uploads/naruto_clapclap.gif'/>
:a:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_cool.gif'/>
:b:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_doigt.gif'/>
:c:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_happy.gif'/>
:d:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_kiss.gif'/>
:e:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_langue.gif'/>
:f:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_question.gif'/>
:g:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_lol.gif'/>
:h:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_ok.gif'/>
:i:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_venere.gif'/>
:j:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_victoire.gif'/>
:k:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_zzz.gif'/>
:l:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_choc.gif'/>
:m:
<img src='http://www.emotasia.com/wp-content/uploads/naruto_pff.gif'/>
:n:
 6. Simpan template dan lihat hasilnya.


Demikian tutorial cara memasang emoticon naruo pada komentar blog.
Semoga infonya bermanfaat .

Labels:

Thursday, August 16, 2012

Cara Memasang Emoticon Cute Brown Bear pada Komentar Blog








Kali ini saya ingin berbagi cara memasang emoticon cute brown bear pada komentar blog.


Contoh emoticon dibawah ini:




:a::b::c::d::e::f::g:

:h::i::j::k::l::m::n:



Jika sobat ingin memasangnya di kotak komentar blog sobat.

Simak langkah2nya:



1. Login Blog

2. Rancangan dan edit HTML

3. Centang "expand widget template"

4. Letakkan kode berikut diatas </body>

<script src='http://ayuningnareswaribrownbear.googlecode.com/files/brownbear.js' type='text/javascript'/>



5. Letakkan kode berikut di bawah <p class='comment-footer'>

atau

diatas kode <b:if cond='data:post.embedCommentForm'>


 <img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-1.gif'/>

:a:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-2.gif'/>

:b:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-3.gif'/>

:c:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-4.gif'/>

:d:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-5.gif'/>

:e:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-7.gif'/>

:f:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-8.gif'/>

:g:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-10.gif'/>

:h:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-11.gif'/>

:i:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-13.gif'/>

:j:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-18.gif'/>

:k:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-19.gif'/>

:l:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-20.gif'/>

:m:

<img src='http://www.emotasia.com/wp-content/uploads/brown-teddy-bear-emoticons-17.gif'/>

:n:



6. Simpan template dan lihat hasilnya.



Demikian tutorial cara memasang emoticon cute brown bear pada komentar blog.

Semoga infonya bermanfaat .

Labels:

Wednesday, August 15, 2012

Cara Memasang Emoticon Kerropi pada Komentar Blog





           
           




Sobat blogger pasti tidak awam tentang emote yang seringkali sengaja ditambahkan di atas kotak komentar .
Ada emote yahoo, monyet bahkan emote animated.
Kali neh saya ingin berbagi cara memasang emoticon kerropi pada komentar blog.


Jika sobat tertarik untuk membuatnya,
simak ya langkahnya:
1. Login blog
2. Rancangan
3. Edit html dan centang "expand widget template"
4. Letakkan kode script berikut di atas </body>
<script src='http://ayuningnareswarikerropi.googlecode.com/files/kerropi.js' type='text/javascript'/>
5. Letakkan kode berikut dibawah <p class='comment-footer'>
atau diatas  <b:if cond='data:post.embedCommentForm'>
<b>
<img src='http://www.emotasia.com/wp-content/uploads/kr_angry.gif'/>
:a:
<img src='http://www.emotasia.com/wp-content/uploads/kr_close.gif'/>
:b:
<img src='http://www.emotasia.com/wp-content/uploads/kr_happy.gif'/>
:c:
<img src='http://www.emotasia.com/wp-content/uploads/kr_normal.gif'/>
:d:
<img src='http://www.emotasia.com/wp-content/uploads/kr_sad.gif'/>
:e:
<img src='http://www.emotasia.com/wp-content/uploads/kr_shocked.gif'/>
:f:
<img src='http://www.emotasia.com/wp-content/uploads/kr_turneye.gif'/>
:g:
<img src='http://www.emotasia.com/wp-content/uploads/kr_verysad.gif' width='50'/>
:h:
<img src='http://www.emotasia.com/wp-content/uploads/full-body-keroppi-frog-emoticon.gif'/>
:i:
<img src='http://www.emotasia.com/wp-content/uploads/full-body-keroppi-frog-emoticon-8.gif'/>
:j:
<img src='http://www.emotasia.com/wp-content/uploads/full-body-keroppi-frog-emoticon-5.gif'/>
:k:
<img src='http://www.emotasia.com/wp-content/uploads/full-body-keroppi-frog-emoticon-6.gif'/>
:l:
</b>


6. Simpan template 


Mudah bukan?..Tinggal copast aja!!
Semoga tutorialnya bermanfaat.

 ❁◕ ‿ ◕❁

Labels: