Buat Menu di atas Header

Ketika membuat blog dengan menggunakan platform Blogger atau Blogspot, maka secara default di atas header akan ditampilkan bilah mendatar berisikan beberapa menu yang biasa disebut dengan istilah ‘Navbar’ atau dapat pula disebut sebagai baris navigasi. Namun karena beberapa alasan (misalnya adalah untuk mempercantik tampilan halaman), maka tidak sedikit pengelola blog yang menyembunyikan bagian tersebut dengan cara menambahkan kode tertentu ke dalam template. disini saya akan menjelaskan Cara membuat Menu Elemen di atas header berfungsi sbgi pembangun tab.

Cara membuat Menu Elemen di atas header

1. Login ke Blogger
2. Halaman Dasbor (Dasboard).
3. Klik Rancangan (Design).
4. Klik Edit HTML.
5. Backup template. Untuk mengantisipasi jika SOBAT salah ketik.
6. Letakkan Kode berikut ini diatas kode ]]></b:skin>
   #navwrapright{width:400px;float:right;text-align:right;margin:0 auto;}
   #subscribes{float:right;margin-right:5px;margin-top:10px;position:relative;border-radius:0;color:#fff;}
   #subscribes a{padding-left:5px;}
7. Kemudian cari Kode </Head>
8. Letakkan kode berikut ini di bawah kode </head>
   <div id='navwrapright'>
   <div id='subscribes'>
   <a href='http://www.twitter.com/YOUR_USERNAME' target='Blank'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6OipaNa1Bc95H0oULh3N2Wx09XILx2xfv9GaZhAjLxzFxaJYtyLn-VEc0lNjLOIbTpPDD9SzYG5aGOxU0mOaiDa4vDXDbLT2BjSZT_G6xK4Ff1WkGrCBvlCXXtxSG6GoW2l5p-3HO7XM/s0/twit.png' title='follow me on twitter to get updates'/></a>
   <a href='http://www.facebook.com/YOUR_USERNAME' target='Blank'><img alt='facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGfeOt1zcM-jbZN_mTJATqN20csjE5_p4ujJ9jc7OjmBRou7sbyHQRXNcZJGPlz7AnJ_ajh0uKYwE1sZXBpyXyo5Wgux3R-8Thus1hqKcf9_OfUtzmGTGifiqFfrsmuwXJMN19Cq5aRk8/s0/face.png' title='Add me to your friends on facebook'/></a>
   <a href='http://plus.google.com' target='Blank'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGORkOeLbnnQF-b3JNkO0C-0R5Nrxs23LaNgICXEHP-e0U7JaI4dYd0Ike4hEfDBQ-PoRCyETaywg4LmaBvsC6Zck7V6jKU0xQ_IKLTgeFa3CFVbEwMDGZd7huCqISgI2KJkNn2mIuVqo/s0/goog.png'/></a>
   <a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' target='Blank'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-FWZf1Ipi6j5pVZnyFOsAgM90EV3ChxYeaagOMUjV6Rv_IljGfKOHTted8IsO-arTQ9REjHlkcL8YYvs14e98GSuK63XOCgXsLwnCMIB3HNJ2tvMTQ-ncvaNow7qHlV2Al4gMYOoRZ_I/s0/subs.png'/></a>
   </div>
   </div>


9. Klik Pratinjau untuk Melihat
10. Klik Save

Note : Tulisan warna merah Ganti atau sesuaikan dengan milik anda

Title: Buat Menu di atas Header
Posted by:anjay
Published :2013-02-21T23:30:00+07:00
Rating: 4.8
Reviewer: 877 Reviews
Ketika membuat blog dengan menggunakan platform Blogger atau Blogspot, maka secara default di atas header akan ditampilkan bilah mendatar b...

Artikel terkait :