Monday, January 24, 2011

Tutorial Bubble Komen

Ehem...ehem...sebelum krole memulakan kelas tutorial kita pada hari ini.krole ingin mengucapkan jutaan terima kasih yang wish krole cepat sembuh setelah selamat cabut gigi tadi(hehehe),so hari ini krole nak buat tutorial bagaimana hendak meletakkan bubble komen ditepi tajuk entri anda semua,sebenarnya tutorial ini direquest oleh blogger caliph~mesti ramai yang kenalkan...so caliph anda wajib untuk membaca tutorial ini ye(hehehe cam memaksa lak),ok murid-murid semua seperti biasa cikgu krole akan cuba buat tutorial ini sesimple yang boleh agar mudah difahami dan berjaya dilaksanakan...tapi kalau tak jadi,jangan malu dan jangan segan tanya saja kat krole ya.ok nak buat ni memang mudah korang hanya perlu ikuti langkah-langkah yang krole sediakan seperti dibawahni.

Langkah Pertama :
-login ke akaun blogger anda>>>Design>>>Edit HTML>>>klik expand widget
-setelah selesai cari code ini <h3 class='post-title entry-title'>
-kemudian pastekan code dibawah ini sebelum atau selepas code tadi.

<b:if cond='data:post.allowComments'>

<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/><br/><span style='font-size:10px'>Komen</span></a>

</b:if>

*yang berwarna merah tu untuk membuat perkataan komen dibawahnya,kalau korang tak nak delete je ayat komen tu.

Langkah Kedua :
-cari code ini </head>
-kemudian pastekan code dibawah ni sebelum atau selepas code tadi.

<style type="text/css">.comment-bubble {

float: right;

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitulL_jWd3FsvzdpbwLsvxUFveSRMb8rq1s2IZq1Ik9nkBwHWWXTFgRGlFzIOT2GdWt-ZcB5GPrtJlitpaVMTij1aATcPGgpCGdmhPLuQ-gPB1r8RWAiFbTpWB0EiJzLpmS6bPZObqOI9m/s1600/Blogger+comment+bubble+%284%29.png) no-repeat;

width: 55px;

height: 38px;

font-size: 18px;

margin-top: -15px;

margin-right: 2px;

text-align: center;

}

</style>



Langkah Ketiga :
-save dan preview..kalau jadi sila menjerit yeahhhhh!!!hehehe



p/s : tutorial oh tutorial~

36 comments:

  1. Krole kenapa tak betulkan position comment balloon tu?

    margin-top: -15px;

    krole boleh up atau turun sikit number tu, baru oke beroo :D

    ReplyDelete
  2. shuff=wuahhh!!!thanks bro...x bape arif g ngee..tq atas indo tu...dalam kadar segera krole tukar~

    ReplyDelete
  3. Disini saya ingin menjawab soalan yang ditanya oleh cik mas.

    Jawapan bagi soalan anda ialah, kerana tuan empunya tutorial ini menginginkan anda mendesign sendiri balloon tersebut.

    cari kod ini,

    http://2.bp.blogspot.com/_1fRuBdlSpLw/S_FeUmNKicI/AAAAAAAAAX4/U7evDQQ8vKc/s1600/Blogger+comment+bubble+%284%29.png

    dan design lah sendiri, haha!

    ReplyDelete
  4. This comment has been removed by the author.

    ReplyDelete
  5. Ada masa leh satdi gak nih...thanks krole.

    ReplyDelete
  6. arigatou krole..
    sy try after blk outstation nti ok, best tutorial ni ^^

    ReplyDelete
  7. waahhhhh..nice tutorial bro..nasib baik blog aku dah ada..hehe..

    ReplyDelete
  8. mas=huhuhu kalo g2 wak kene edit sndiri ngeee~

    ReplyDelete
  9. shuff=wuahhh!!!thanks bro...hehehe~

    ReplyDelete
  10. yastro=huhuu amat dialu-alukn yas~

    ReplyDelete
  11. caliph=huhuhu...ok2 caliph..wuahh!!!outstation kat ne???

    ReplyDelete
  12. matika=huhuhu...tahniahhhh..!!!yeahhh!!!

    ReplyDelete
  13. zalin=hheheh tu r krole kate blog zalin da ade mende ni ngeee~surprise...!!!

    ReplyDelete
  14. farah=sekali lagi...tahniahhh!!!....yeahhh!!!

    ReplyDelete
  15. krole..
    nk gi kL kjap.. psl client nk t/tgn form utk plan savings tu ^^

    latest en3: ~ 10 saat saja ~

    ReplyDelete
  16. nasib baik dah buat...hehe...

    meletopz la bro~!

    ReplyDelete
  17. pendekar berkuda=ahaks...tq2 tp x dpt nak lawan pendekar berkuda yg femes n macho hehehe~

    ReplyDelete
  18. aku fobia=huhuhuu "i'am sory" ngeee~

    ReplyDelete
  19. krole..
    dh mjadi, yeahhh.. tp ada satu blom settle..
    coding mana perlu edit utk tukar kaler font kt atas bubble comment tu?

    ReplyDelete
  20. krole..
    juz nk update info..

    rsa kaler font kt bubble tu sama dgn kaler font kt title en3.. so klau tukar kt title en3, scara auto kt bubble btukar jgak..

    p/s: arigatou.. tggu special en3 ok ^^

    ReplyDelete
  21. nak try la nanti~~ hee~ thanks!

    ReplyDelete
  22. Salam

    Kalau tak jumpa code - h3 class='post-title entry-title'- camne ye?

    ReplyDelete