12 June 2011

Cara Ganti Icon Blog pada Address Bar

Kalo kita membuka website atau blog, biasanya ada icon di sambing Address Bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini .Tapi jika kita tidak puas dan ingin mengganti dengan icon lain bisa saja. Contohnya seperti icon Jempol di Tab Bar Blog ini.

Nah berhubung kebetulan ada teman yang nanya soal cara mengganti icon tersebut, maka kali ini saya akan coba buat tutorial singkat tentang hal tersebut. Caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x42 pixel sampai 32x32 pixel. Setelah itu upload file icon yang udah dibuat tadi ke Photobucket atau web sejenisnya. Tapi kalo kalian males untuk membuat icon sendiri bisa langsung cari aja di Google gambar sesuai dengan keinginan dan ukurannya.

Setelah itu masuk ke Dashboard --> Layout --> Edit HTML dan tempatkan kode/script berikut tepat sebelum kode </head> (biar gak repot cari dengan CTRL+F).
<link href='http://saungsandy.blogspot.com/ikongue.gif' rel='SHORTCUT ICON'/>
Ganti kode yang dicetak warna merah dengan link gambar yang kalian inginkan. Setelah itu SAVE dan selesai deh...

FOR BONUS
Skalian saya kasi tutorial tentang caran membuat text berjalan di Tab Bar. Caranya gampang, tinggal tempatkan kode/script berikut setelah kode <head>
<script language='JavaScript'>var txt=&quot;Welcome To Saung Sandy &quot;;
var kecepatan=130;var segarkan=null;function bergerak() { document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout(&quot;bergerak()&quot;,kecepatan);}bergerak();
</script>
Ganti text warna merah sesuai dengan keinginan kalian. Selesai deh...
Met nyoba ya..:D

NB: Nih Screenshot hasil penerapannya di blog saya

157 Komentar:

  1. dapetttt ilmu...senengNa,ntr mauuuu nyobain jg dech:))

    Thengkyu Sandy^^

    ReplyDelete
  2. tq mas saya lagi nyoba hehe

    ReplyDelete
  3. saya sudah nyoba cara gnti icon tp ggal....

    ReplyDelete
  4. sy nyoba pakai wordpress. berhasil! :-D

    ReplyDelete
  5. @Make Ur_LiFe : Coba dicek lagi mungkin ada step yg kelewat...:D

    ReplyDelete
  6. Kok Gak Bisa Malah Error ,, Tolong Pencerahaannya Thx's

    ReplyDelete
  7. sama ko error klo pakai blogger,,,,,,,,

    ReplyDelete
  8. kalo teks berjalannya bisa, yg gak bisa ganti iconnya. mohon dibantu ya..

    ReplyDelete
  9. mas,,cara buat table komentar di blog gimana..?

    ReplyDelete
  10. Buat yang masih gagal coba di baca lagi step2 nya...
    @logan : maksudnya tabel komentar apa ni? belum paham maksud km...:)

    ReplyDelete
  11. Makasih Info, saya udah coba & dua_duax brhasiL. . .

    saya pke photobucket trus piLih direct Link. . .

    ReplyDelete
  12. sangat berguna bagi saya yang masih amatir :)) thanks yaaa sekalian juga tolong follow blog saya ada tutorial juga :D

    ReplyDelete
  13. trims gan tipsnya...mampir ke gubug ku ya? Ditunggu caci makinya..hehehe...

    ReplyDelete
  14. kebetulan gw baru belajar ni.,
    thanxz yya infonya,,, :)

    ReplyDelete
  15. mas tolong donkk caranya di jelaskan mas...
    kalo bisa di kasih gambar biar jelas
    :D
    (newbie)

    ReplyDelete
  16. wah keren juga, saya mau coba ah ke blog saya

    ReplyDelete
  17. lumayan dapat tips baru
    kunjungi juga www.blackdakota.co.cc

    ReplyDelete
  18. thnx bgt kk!!

    Open my blog ya. www.qolby-182.co.cc

    ReplyDelete
  19. salam kenal dik,, ilmunya sangat bermanfaat,, bila ada waktu ,singgah yah ke rumah.

    ReplyDelete
  20. artikel yang bagus mas,....
    di tunggu kunjungan balik nya....
    makasih ^ ^

    ReplyDelete
  21. dapat ilmu
    makasih ia :)

    ReplyDelete
  22. OK mas bro..
    udh di coba & berhasil
    thx ilmunya.. =)

    ReplyDelete
  23. Ane uda follow...jagn lupa follback ya..di tunggu..!! heeeee..

    ReplyDelete
  24. thanks bgt gan tutornya bermanfaat bgt... salam bloger

    ReplyDelete
  25. thanks ya :) BERHASIL ^^

    mantap dah! keep posting terus ya...

    ReplyDelete
  26. Sama-sama...
    huhuhu...Senangnya diriku kalo postinganKu berguna buat orang lain :D

    ReplyDelete
  27. bisa d coba tuh...
    o iya,,, gw bleh copy gk tuh?? buat postingan di blog gw??

    ReplyDelete
  28. mantap euy kang,,,, thanks ya kang,,,, sipp dah,,,

    ReplyDelete
  29. wah mantep nich sob, coba ach...nice post

    ReplyDelete
  30. Yang mau co basilahkan dicoba semoga sukses makmur lancar jaya sentosa selamanya!! :D

    Dan yang mau Copas Tutorial silahkan Copas Sesuka hati, Makin berguna bagi orang lain kan makin banyak Amal saya (Lumayan buat ngimbangin sama dosa).Xixixi

    TAPI jangan lupa kasih Link http://saungsandy.blogspot.com tentunya...:D

    ReplyDelete
  31. mantap gan... thanks, jempol dah..

    ReplyDelete
  32. Makasih atas infonya, semoga bisa diterapkan di blog saya =)

    ReplyDelete
  33. makasih ya ga info nya..
    http://iniblogane.blogspot.com

    ReplyDelete
  34. Replies
    1. Coba di cek lagi..mungkin ada Langkah2Nya yg belum benar..Semangat! :D

      Delete
  35. wah gampang., ne gantinya...
    bwt sobat2 baca dengan teliti dulu...!!
    :D

    ReplyDelete
  36. trims mas buat infonya.. silahkan main ke blog-ku juga yah di http://nyemplungshops.blogspot.com.. sukses terus mas!

    ReplyDelete
    Replies
    1. This comment has been removed by the author.

      Delete
  37. mantafff gan..monggo diliat hasilnya
    http://jayantimalang.blogspot.com/
    hehehehe..

    ReplyDelete
  38. waah, sangat bermanfaat... akhirnya bisa juga... terimakasih informasinya ^^. kalau bisa silakan dilihat...
    www.nadnadhifa.co.cc

    ReplyDelete
  39. makasih bro saya sudah coba semuanya ternyata hasilnya bagus juga bro

    ReplyDelete
    Replies
    1. ini alamat blog ku http://anggawar.blogspot.com/ makasih sudah berbagi ilmunya kk

      Delete
  40. All : Thanks udah mampir ke Blog ini.. pagi ini gw akan jalan2 ke Blog kalian juga :))

    ReplyDelete
  41. halo bang sandy salam kenal :)
    makasih bgt nh ilmunya hehe. jika ada waktu silahkan mampir ya ke blog gua http://jakaawaludin.blogspot.com/ hihi :p

    ReplyDelete
  42. thanks atas infonya sahabt

    ReplyDelete
  43. saya suka template blog anda. simple + kreatif + menarik :)
    thanks buat tipsnya kawand..
    #newbie :D

    ReplyDelete
  44. makasih infonya kakak..
    sangat membantu bagi saya yang masih pemula...

    ReplyDelete
  45. langsung berhasil dipercobaan pertama!!!
    thx....
    buat yang belom berhasil coba perhatiin tanda petik satu di kode skripnya, kalo kehapus ga mungkin bisa, itu kemungkinan besar kehapus soalnya!!!!

    maaf nyubi sedikit sotoy!!! :D
    minta pollownya dong biar semangat nulis!!
    here we go >>> http://thousand-links.blogspot.com

    ReplyDelete
  46. oh iya sekalian mau ngasih masukan!
    di blog ini kalo ga mainin mouse kurang lebih 1 menit ada saving mode-nya ya?!
    itu sedikit ganggu, tadi pas lagi baca2 eh tau2nya jadi gelap layarnya!!!

    hihihihihihi, keren sih tapi ganggu pengunjung blognya!! :D

    ReplyDelete
    Replies
    1. Iya dikasih Saving Mode nya biar Hemat energi #tsah :D
      Tapi Thanks masukannya yee..

      Delete
  47. keren juga postinganya..n dah gue praktekin gan...

    follow back ya gan...
    http://arti-psikologi.blogspot.com/

    ReplyDelete
  48. tetep aja ga bisa gan...
    udah teliti banget gan...
    coba agan ganti icon blog agan, kl bisa coba tunjukin screenshoot penempatan kodenya ... ikon blog agan masih blogger.
    makasih gan...

    salam
    http://belanjaonlineindonesia.co.cc

    ReplyDelete
  49. Oke deh...kalo masih ada yang gagal/gak ngerti cara ganti icon Blognya dengan cara ini. Saya akan buat Tutorial yang lebih mudahnya. klebetulan BLOGGER punya fitur baru sehingga kita gak perlu melalui edit HTML (kaya sebelumnya). Nih langsung aja di klik disini

    ReplyDelete
  50. @ benny hidayat : aq posting hampir sama dengan postingan agan sandy57 ... cekidot,moga berhasil

    http://www.portalblogger.co.cc/2012/05/ganti-icon-blogger.html

    ReplyDelete
  51. mampirlah kebloggku ada kekurangan apam dibloggku
    http://sihombing-thedarkbing.blogspot.com/

    ReplyDelete
  52. sudah dicoba, ternyata bisa.. Makasih ^^

    ReplyDelete
  53. mantep ni blog,.. standar tp menarik.. :)

    ReplyDelete
  54. Makasih gan Ilmunya
    Jangan Lupa Mampir Di Blogku Ya
    http://hjgondes.blogspot.com/
    jangan lupa difollow ya ntar gwa followback yg udah follow..

    ReplyDelete
  55. Thanks All..I'll visit back..:)

    ReplyDelete
  56. berhasil bang, makasih :)
    mampir ke blogku ya
    http://limited-edition23.blogspot.com/

    ReplyDelete
  57. sippa gan..follow back my blog di aim-mualim.blogspot.com
    thankz..

    ReplyDelete
  58. makasih buat infonya.. visit to my blog ya.. :)) http://khusnulintheworld.blogspot.com

    ReplyDelete
  59. terima kasih infonya gan ,,,,mantap bangets

    ReplyDelete
  60. makasi ya kang ternyata berhasil succes

    ReplyDelete
  61. keren gan ilmunya.. mampir ke blog ane gan www.supriatna.co.cc

    ReplyDelete
  62. siip.. mkasih ya.. jgn lupa visit my blog ya...

    ReplyDelete
  63. oya nieh blog ku gan.. http://zulvangames.blogspot.com

    visi yah.. ^_^

    ReplyDelete
  64. Mkasih infonya gan (^_^)
    Visit blog aku ya: gustianime.blogspot.com

    Follow juga ya,,ntar aku follow juga bagi yg ngefollow :)
    Thanks

    ReplyDelete
  65. Mkasih infonya gan (^_^)
    Visit blog aku ya http://1freeinvestment.blogspot.com/

    salam blogger
    thanks

    ReplyDelete
  66. Thanks juga ya..I'll visit yours too :)

    ReplyDelete
  67. Kok di aku kata2 welcomenya engga jalan ya ? Trus fotonya juga masih kayak biasa, emmm kira2 apa nya ya yg salah ? :(
    visit juga ya http://fidyakhrahayu.blogspot.com/
    Makasih sblumnya :)

    ReplyDelete
  68. @coba lebih teliti lagi gan dg kode2nya..pasti bisa kok. :)

    ReplyDelete
  69. thanks... infony bermanfaat banget... ^_^

    ReplyDelete
  70. Thanx bgt infonye, wat newbie seperti w...
    it work

    ReplyDelete
  71. Semoga blognya makin ramaaaiii hehehe

    ReplyDelete
  72. kalo mau masukin gambar yang bergerak gimana

    ReplyDelete
  73. makasih banget yaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

    ReplyDelete
  74. makasih banget ya gan! gw lagi lomba2 nih sama temen2 sekelas gw biar tau siapa yang blog nya paling bagus, soalnya buat ujian praktek TIK, guru gw nyuruh biat blog,

    ReplyDelete
  75. eh gan, itu gambarnya kalo udah ada digimanain? di upload ke mana? terus itu di javascript nya kan pake alamat blog sendiri, nah terus gambarnya dari mana?

    ReplyDelete
    Replies
    1. Gambarnya di Upload dulu gan bisa ke photobucket.com, stelah itu ambil link url gambarnya gan..

      Delete
  76. sy dh nyoba pke ggle crome updaten terbaru gk bisa tampil....kenapa ya gan??tp klo pake firefox bisa....

    ReplyDelete
  77. than'x y Gan di blog ane work , lain kali mampir ya ke http://a7xgodhatesus.blogspot.com/ Di tunggu komentarnya

    ReplyDelete
  78. ane dak bisa gan knp ya padahal dah ngikutin smua petunjuk gan, mohon bimbingan
    -salam bebek

    ReplyDelete
  79. agan, follow back donk agan. .,
    hehe
    salam blogger ya

    http://drafterkita.blogspot.com/

    ReplyDelete
  80. Gan kok kok ane malah gagal? malah blog ane sekarang katanya kena malware T.T

    ReplyDelete
  81. iseng-iseng buka ngedit blog lagi, sekitar 2 tahun yang lalu aq coba, sekarang tak coba lagi, masiiiih saja gak bisa, kenapa yaa??

    ReplyDelete
  82. Wow, Setelah ane coba di blog ane ternyata WORK ! :)
    thanks iya gan buat informasi nya ..
    mampir juga ke blog ane gan .. makasih :)

    ReplyDelete
  83. ikuttt bilang makasih ahhh....
    mampir ya' . http://unyublast.blogspot.com
    makasih, lagi :)

    ReplyDelete
  84. Gan Masih Kagak Ngarti Pas yang ini.>>
    Ganti kode yang dicetak warna merah dengan link gambar yang kalian inginkan. Setelah itu SAVE dan selesai deh...]
    Cara tau link gambar dari mana..???

    ReplyDelete
  85. iya gan bener, dah tak coba dan BERHASIL, makasih triknya ya , ,, ,,,

    ReplyDelete
  86. bagus gan..punya belum ada iconnya.ijin sedot

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

    ReplyDelete
  88. thaks kunjungi juga ya blog ane http://ilhamaf2.blogspot.com/

    ReplyDelete
  89. Gan, Blog saya law dibuka di Firefox bisa icon na, tpi klw di google chrome knapa g bsa gan????
    tolong ya gan
    :)

    ReplyDelete
  90. sebelum (/head) maksudnya gimana? :)
    Dateng juga yah di blog ku, cerita-cerita khayalan dan nyata www.dien-galuh.blogspot.com atau http://dien-galuh.blogspot.com

    ReplyDelete
  91. Saya juga ada artikel serupa di blog Desainew


    ReplyDelete
  92. kalau ada informasi lain seputar ini perbaharui aja gan

    ReplyDelete
  93. kujngan balik ya
    www.henfuu.blogspot.com

    ReplyDelete
  94. kunjungin ya :D
    masih baru communicationscienceunmul@blogspot.com

    ReplyDelete
  95. terima kasih, lgsg saya coba

    ReplyDelete
  96. Replies
    1. Di Baca Lagi aja kawan, yg lain bisa pasti dirimu juga bisa :)

      Delete
  97. udah saya coba, dan berhasil
    thanks infonya mas sandy :D

    ReplyDelete
  98. Thanks...dude! even it doesn't work yet.

    ReplyDelete
  99. mudah dimengerti artikelnya... mantab sob, thanks

    ReplyDelete
  100. bisa dicoba nih kayaknya...
    ninggalin jejak dulu ah di sini..

    ReplyDelete
  101. terima kasih udah di bagi ilmunya

    ReplyDelete
  102. terima kasih xoxoxo membantu sekaliiii

    ReplyDelete

Komentarmu Menunjukan Kualitasmu di Dunia Maya (^_^)

Sandy Corat-coret! © 2012 | Created by Sandy A. | Powered by Blogger.com