Admin Bar Widget untuk Blogger

Ketika ingin mengupdate blog kadang-kadang kita mendapatkan beberapa ide posting baru atau untuk melakukan beberapa perubahan dengan blog. Admin bar ini memudahkan untuk menavigasi langsung kepada point-point yang ingin kita rubah secara langsung.

widget ini menciptakan link yang akan membawa langsung ke pilihan blogger. Ada dua jenis dan masing-masing memiliki cara instalasi yang berbeda. Kita akan membahas kedua cara tersebut.

1. Instalasi Custom jenis-jenis ini adalah lebih bergaya, dapat melihat screenshot di bawah ini.

Admin Bar Widget

Untuk memasang widget ini, pergi ke PAGE ELEMENT>> ADD A GADGET>> HTML/JavaScript dan salin kode di bawah ini.

<ul class="adminbar">
<li><a class="dashboard" href="http://www.blogger.com/home" target="_blank">Dashboard</a></li>
<li><a class="settings" href="http://www.blogger.com/blog-options-basic.g?blogID=####" target="_blank">Change Settings</a></li>
<li><a class="layout" href="http://www.blogger.com/rearrange?blogID=####" target="_blank">Change layout</a></li>
<li><a class="editpost" href="http://www.blogger.com/post.g?blogID=####" target="_blank">Edit posts</a></li>
<li><a class="newpost" href="http://www.blogger.com/post-create.g?blogID=####" target="_blank">New post</a></li>
</ul>

Rubah #### dengan id blog Anda. Anda dapat menemukan ID blog anda pada Adress Bar diatas, kemudian jangan lupa disimpan.

ID Blog

Kemudian pergi ke EDIT HTML lalu temukan ]]></b:skin> kemudian salin kode berikut diatasnya:

ul.adminbar
{background-color:#EEEEEE;
border:1px solid #E6E8E9;
margin-bottom:8px;
padding:5px 5px 0;
}
ul.adminbar li {
background-color:#FAFAFA;
border:1px solid white;
list-style:none outside none;
margin-bottom:6px;
outline:1px solid #DDDDDD;
padding:12px;
}
ul.adminbar li a
{display:block;
color:#888888 !important;
text-shadow:1px 1px 0 #FFFFFF;
text-decoration:none;
font-size:22px;
height:27px;
margin:0 0 0 15px;
}
a.dashboard
{background:url(http://i54.tinypic.com/9iseuw.jpg) no-repeat 0px 0px;
padding:4px 0 2px 47px;
}
a.settings
{background:url(http://i56.tinypic.com/2hdofnt.jpg) no-repeat 0px 0px;
padding:5px 0 0 47px;}
a.layout
{background:url(http://i55.tinypic.com/2d8s4qw.jpg) no-repeat 0px 0px;
padding:5px 0 0 47px;
}
a.editpost
{background:url(http://i54.tinypic.com/10gwpl5.jpg) no-repeat 0px 0px;
padding:5px 0 0 47px;
}
a.newpost
{background:url(http://i54.tinypic.com/4ky1xi.jpg) no-repeat 0px 0px;
padding:5px 0 0 47px;
}

Kemudian Simpan & Selesai sudah.

Sekarang jika Anda mengalami kesulitan dengan widget diatas, ada cara lain yang lebih sederhana untuk menginstalnya tanpa menggunakan CSS.

2. Instalasi jenis klasik ini lebih sederhana dan mudah. Hanya pergi ke PAGE ELEMENT>> LINK LIST dan tambahkan link berikut di dalamnya.

Dashboard : http://www.blogger.com/home

Change Settings : http://www.blogger.com/blog-options-basic.g?blogID=####

Change Layout : http://www.blogger.com/rearrange?blogID=####

Edit Posts : http://www.blogger.com/post.g?blogID=####

New Post : http://www.blogger.com/post-create.g?blogID=####

Ganti #### dengan ID blog kamu dan kemudian simpan.

127 komentar untuk “Admin Bar Widget untuk Blogger”

  1. thanks info nya sob :) bermanfaat.
    kunjungan balik ya

    BalasHapus
  2. nah mulai beraksi lagi... hehehe...

    BalasHapus
  3. terima kasih atas informasinya.
    masih belajar nih bro.

    BalasHapus
  4. thanks, tips ini membuat blogging menjadi lebih efisien.. kemana aja nih bung OB? :)

    BalasHapus
  5. Tutorialnya sangat mantap Bos. Cuma sayang templatenya ini kalau kita baru berkunjung, kita kira ini blog yang tidak aktif. Tapi ini sangat mantap koq.

    BalasHapus
  6. wah seru nieh bang...
    thanks tutornya...

    BalasHapus
  7. wah mantap mas
    numpang copy ya mas ???

    BalasHapus
  8. ok juga sob infonya...
    mau segudang tutorail or fre software kunjungi blog ane http://sandydoank12.blogspot.com

    BalasHapus
  9. Jadi bisa langsung nge blog ya,,, info baru nieh,,,, thank's ya buat infonya,

    BalasHapus
  10. Keren bang,terima kasih sudah berbagi informasi yang bermanfaat.

    BalasHapus
  11. Tanya yang lain ya?
    Bagaimana caranya memberikan highligh atau warna penulis post dan tag di akhir posting?seperti postingan blog ini.maap baru belajar nich..
    makasih.

    BalasHapus
  12. keren banget nih. . . cocok buat newbie kayak gw nih. .
    thax ya om

    BalasHapus
  13. thank you atas atikrlnya yang bermanfaat

    BalasHapus
  14. Sip...sip...ilmu baru buat pemula seperti aku ni...Makasih

    BalasHapus
  15. langsung test ah. makasih banyak tipsnya

    BalasHapus
  16. cara pasang meta title, meta keyword dan meta description gimana ya?

    BalasHapus
  17. info yang bagus, tapi saya ga pake blogspot ...

    BalasHapus
  18. mantap mas..
    mas mau tanya, kalau terkadang kita pasang widget ga muncul, tetapi langkah2 nya udah sempurna, itu apa ya penyebabnya ?
    mohon bantuannya mas...

    BalasHapus
  19. Info yang bagus mas, kemarin sempat bingung mau edit artikel yang agak jadulan, cz ada yg ngasih comment, ktanya ada code yg tdk dapat dipasang gt. se x lg maksih infonya

    BalasHapus
  20. wah widget ini belum saya pakai ... kelihatannya bagus juga ... nanti mau saya coba di blogger saya

    BalasHapus
  21. Woh keren tuh, biar blog jadi tambah simple dan easy-to-navigate

    BalasHapus
  22. Waah... tutorial yang bagus... dan sangat fresh... :)

    BTW, saya sudah follow kamu...
    Follow balik saya ya...
    Thanks...

    BalasHapus
  23. sangat menarik, benar2 pas dengan judulnya optimasi blog dan saya terkesan dengan template blog anda bro.... salam kenal

    BalasHapus
  24. woaaahh... mantabs gan, bener2 fresh content

    BalasHapus
  25. Bro link kamu juga saya udah pasang di blog saya coba di cek......

    klo bisa link saya di psang juga ya hehehee ingat bro klo bisa di pasang hahahha.....salam knl...:)

    BalasHapus
  26. Upzz ada lagi bro skalian saya follow kamu...:)

    BalasHapus
  27. ada lagi bro skalian juga saya pake template kamu ha..ha...ha....mari berkawan..:)

    BalasHapus
  28. sangat menarik ni impo sob...

    sekalian ane follow n pasang blog ini di blog saya... coba aja cek denga nama optimasi blog

    jgan lupa sob, follow and link balik ya...

    BalasHapus
  29. Thanks Infonya gan
    sangat bermanfaat

    BalasHapus
  30. Nih blog amat membantuku...
    Thanks..
    Oya,, buat anak-anak pemumpi indonesia...
    Gabung dza di http://www.dreamhyer.co.cc ....
    Komunitas Pemimpi Indonesia...
    Sekali lagi thanks...

    BalasHapus
  31. thanks for the info...
    nice post..

    lam. kenal...numpang berkunjung

    BalasHapus
  32. ijin copas artikel yoo..tenanng tak cantumkan sumbernya

    BalasHapus
  33. Menarik juga tuh. Coba ah . . .


    Salam.

    BalasHapus
  34. makasihh kak sharingnya jadi pengen coba nich

    BalasHapus
  35. makasih infonya bung... jadi pengn coba

    BalasHapus
  36. Nice Article, inspiring. Aku juga suka nulis artikel bidang bisnis di blogku : http://www.yohanwibisono.com, silahkan kunjungi, mudah-mudahan bermanfaat. thx

    BalasHapus
  37. Terima kasih udh mau berbagi ilmu nih,!

    BalasHapus
  38. mantab infone, tapi maaf ga begitu paham nih bro apa fungsinya, ga ada contohnya..tks

    BalasHapus
  39. Aku sangat salut sama blog ini. Setiap ada posting atau artikel yang baru, sangat rugi rasanya kalau di lewati.

    Maju terus pantang mundur.

    BalasHapus
  40. Great articles here, all I need to know.

    BalasHapus
  41. Terimakasih Atas Infonya....

    www.ahmadlukmannulhakim.co.cc

    BalasHapus
  42. lho bukannya kalo mo edit klo kita login ada gambar kupu2nya tuh di setiap postingan...

    BalasHapus
  43. Mas OB Kenapa Link Saya Gak Dipasang2 Padahal Link BLog Ini Saya Sudah Pasang Sejak Awal..?
    Apa Karna Pagerank Blog Saya Masih 0 Jadi BLog Sebagus ini tidak Mau TUkeran Link Sama Blog Saya..? Ditunggu Balasannya Terima Kasih.

    BalasHapus
  44. Yernyata ada juga toh cara seperti ini. Mantaf.

    BalasHapus
  45. terima kasih atas infonya....
    mampir juga ke blog ane ya gan...tq..


    http://pitakaset.blogspot.com

    BalasHapus
  46. info useful nie... aku jadi kepengen py blog brplatform blogger biar bisa utak-atik sendri cmsnya klo di wordpress.com kan ga bsa..
    nice post y??

    BalasHapus
  47. Trik & Trick: Rahasia Trik Gratis Internet Dengan Mengandalkan K...: "Ssssssstttttttttt ini bener'' rahasia lho,tidak semua orang tau bahkan mungkin cuma aku yang tau soal trik internet gratis dari telkomsel,ke..."

    BalasHapus
  48. Artikel dan blognya bagus juga, komentar juga ya ke blog saya www.infonotesharian.blogspot.com

    BalasHapus
  49. Wowwwwwwwwwwwwwww mantapssss

    BalasHapus
  50. ini salah blog atau apa yah, blog optimasi SEO, SEO apaan yah, kalu pengunjungnya diatas 5.000 per hari, baru deh nah itu baru optimasi SEO, boleh kasih tip2nya..lha ini??

    BalasHapus
  51. Makasi Infonya Dolor, jangan lupa mampir k blog ane y http://eagamesworld.blogspot.com/

    BalasHapus
  52. sob caranya pasang meta tag hingga kalu scr di google situsnya terdiri dari pilihan??

    BalasHapus
  53. thnks yah sob,,,


    http://komikblaze.blogspot.com

    BalasHapus
  54. Info mantap... sering posting yang bagusss

    BalasHapus
  55. Wah, main kode-kode lagi ni. Makin lengkap jadinya.

    BalasHapus
  56. Wah mantap tutornya. Langsung dicoba gan..

    BalasHapus
  57. Sudah saya coba cara diatas tapi belom tu mas :( ngecheck nya gmana ??

    BalasHapus
  58. thanks sob infonya
    keep posting

    BalasHapus
  59. Keren nih, bisa lebih mempermudah dalam pengelolaan blog. Saya simpan ya gan

    BalasHapus
  60. wah info baru nih.... jadi kita lebih mudah atur blgo qt sendri dari home page... makasih yh.. kunjungan balik yhh

    BalasHapus
  61. makasih ilmunya. salam kenal

    BalasHapus
  62. gimana sih bikin ular ularan??????

    BalasHapus
  63. Wah bagus Juga mohon komentar saya pada blog you biar sama2 membantu ni lagi boring banget gak ada yang kasih Kritik dan saran bua saya

    BalasHapus
  64. Such a great article giving some great information genuinely explaining some of the key things which you need to be aware of in particular about the part relating to getting some couseling prior to getting life insurance, so many people don't even consider it.

    BalasHapus
  65. Jadi makin praktis ya untuk menuju ke dashboard.

    BalasHapus
  66. Memang akan praktis, bisa menyingkat waktu dan efisiensi saya coba mas thanks sharingnya

    BalasHapus
  67. wah bagus nih. widget ini mempermudah login kita ke blog :D maturnuwun gan infonya :D

    BalasHapus
  68. Sangat bermanfaat, thanks atas infonya..

    BalasHapus
  69. Blog dan artikelnya bagus, komentar juga ya di web blog saya www.when-who-what.com

    BalasHapus
  70. Thanks infonya gan, salam kenal n kunjungan.

    BalasHapus
  71. info yg sangat membantu, thanks.

    BalasHapus
  72. http://www.fidashop.co.cc (Grosir Sepatu Futsal)

    BalasHapus
  73. http://www.ac-m1lan.blogspot.com

    BalasHapus
  74. Info bagus bro, lanjutkan postinganmu :D

    mampir ya www.evpro.net

    BalasHapus
  75. wan mantap bos..tp gag mudeng saya...newbie

    BalasHapus
  76. thanks untuk artikel kerennya..

    BalasHapus
  77. Wah mantap tutornya.. Thanks..

    BalasHapus
  78. thanks GAN. . . . :)
    don't 4geth come to me :http://aboutwindowsall.blogspot.com/

    good luck. . ^_^

    BalasHapus
  79. Kayaknya bagus gan... :)

    Coba Dulu ah... :)

    BalasHapus
  80. Menarik tips bloggernya, menunya jadi vertikal .... , menu bawaan blogger masih muncul atau tergantikan dengan yang baru , mohon pencerahannya???

    BalasHapus
  81. Hmmm... Boleh juga nih widget... Thank you bos udah sharing...

    BalasHapus
  82. Wifdget yg bagus nih.. thanks atas info nya sob

    BalasHapus
  83. bagus nih kayaknya...!!! http://seo-press.blogspot.com/2011/02/kompetisi-web-kompas-muda-aqua.html

    BalasHapus
  84. kreatif gan, berarti di tampilan blognya muncul widget itu ya gan? thank ilmunya, sangat bermanfaat

    BalasHapus
  85. Mantep, Tapi Cara Penerapannya Agak Ribet juga

    BalasHapus
  86. artikelnya menarik nian bos... tentunya pasti sangat bisa kumanfaatkan buat blog ku ini.. hehe.. two thumbs up deh

    BalasHapus
  87. I was very encouraged to find this site. I wanted to thank you for this special read. I definitely savored every little bit of it and I have you bookmarked to check out new stuff you post.Don't forget to visit my site on the new topic Harga Jual Blackberry iPhone Laptop Murah | Harga Jual Laptop Murah | Harga Jual Blackberry Murah | Harga Jual iPhone Murah

    BalasHapus
  88. Wah telat aku.... baru tau nich buat yang seperti ini,, makasih om...ilmunya,,,,

    BalasHapus
  89. makasih share info nya sob.. sangat bermanfaat sekali dan mudah dipraktekan.. GBU

    BalasHapus
  90. Terima kasih tips-nya..
    It's work, bosss! :)

    BalasHapus
  91. Thanks infonya :)
    mau coba ahhhh

    BalasHapus
  92. ide bagus! admin blogger/blogspot juga berhak dapat tampilan bagus kan. hehe. sekali2 nyaingin wordpress lah. thanks a bunch!

    BalasHapus
  93. Wah keren nich mas infonya,koding lagi :)

    BalasHapus
  94. Info yang sangat berguna karena blog saya juga berplatform blogspot jadi tutorial ini bisa dicoba..
    trims..

    BalasHapus