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.

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>

Ganti tulisan berwarna merah dengan ID blog anda. Dapat anda lihat seperti gbr ini:

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

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

Setelah itu simpan Template anda.

Selesai deh...
Selamat mencoba yah>>>

Artikel terkait :