Cara Gampang Membuat Atau Menambahkan Menu Navigasi Di Blogspot

Halo sobat blogger, kali ini admin akan share satu widget pendukung yang sebaiknya atau wajib agan terapkan di blog kesayangan agan,, yaa... menu navigasi blogger yang responsive dan keren tentunya. Salahsatu fungsi dari menu navigasi diblogger adalah untuk memudahkan para pengunjung mengetahui bagian-bagian atau daftar pokok dari pembahasan blog agan, jadi pengunjung akan merasa dimanjakan saat hendak mencari spesifikasi dari menu utama blogspot agan.

Nah.. tanpa berlama-lama berikut admin share Menu Navigasi Blogspot keren yang admin copy dari forum-malaikatkomputer.blogspot.com :

Cara membuat menu bar di blogspot:

• Silahkan masuk ke akun Blogger agan.
• Klik halaman "Template" download template lengkap untuk berjaga-jaga terjadi hal-hal yang tidak di inginkan.
• Centang "Expand Template Widget". 
• Terus silahkan cari kode ]]></b:skin> denan menggunakan Ctrl + F.
• Simpan kode css di bawah ini tepat di atas kode ]]></b:skin>

#menubar{border-bottom:4px solid #f00;width:1025px;height:32px;background:#000;float:center;margin-bottom:3px}#menubar ul{float:left;margin:0;padding:0}#menubar li{float:left;list-style:none;margin:0;padding:0}#menubar li a,#menubar li a:link{float:left;padding:8px 12px;color:#fff;text-decoration:none;font-size:13px;font-weight:bold}#menubar li a:hover,#menubar li a:active,#menubar .current_page_item a{background:#f00;color:#fff;text-decoration:none}#menubar li li a,#menubar li li a:link,#menubar li li a:visited{font-size:12px;background:#f00;color:#fff;text-decoration:none;width:150px;padding:0 10px;line-height:30px}#menubar li li a:hover,#menubar li li a:active{background:#000;color:#fff}#menubar li ul{z-index:9999;position:absolute;left:-999em;height:auto;width:170px;margin-top:32px;border:1px solid ##ff0000}#menubar li:hover ul,#menubar li li:hover ul,#menubar li li li:hover ul,#menubar li.sfhover ul,#menubar li li.sfhover ul,#menubar li li li.sfhover ul{left:auto}#menubar li:hover,#menubar li.sfhover{position:static}

• Untuk seterusnya silahkan cari kode <div id="content-wrapper"> 
• Simpan kode script di bawah ini tepat di atas kode <div id="content-wrapper">

<div id='menubar'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='https://buktiinaja.blogspot.co.id/search/label/Tips%20Sehat'>Tips Sehat</a></li>
<li><a href='https://buktiinaja.blogspot.co.id/search/label/Ilmu%20Komputer'>Ilmu Komputer</a>
<ul>
<li><a href='Link Google Plus Agan'>Google +</a></li>
<li><a href='Link Facebook Agan'>Facebook</a></li>
<li><a href='Link Twitter Agan'>Twitter</a></li>
</ul></li>
</ul>
</div>

Langkah terakhir silahkan sesuaikan link diatas seseai kebutuhan agan dan Simpan Template.

Keterangan Tambahan: 

• Sesuaikan kode #ff0000 (border bawah menubar), 1025px (lebar menubar), #000000 (background menubar).
• Silahkan nama menubar yang berwarna biru Home sesuai dengan keinginan agan.
• Ganti link https://buktiinaja.blogspot.co.id/search/label/Tips%20Sehat dengan link agan.

Semoga bermanfaat..
Salam : https://forum-malaikatkomputer.blogspot.com

Admin : 4nd14M

Artikel Terbaru!

Recent Posts Widget

Cara Gampang Membuat Atau Menambahkan Menu Navigasi Di Blogspot 2018-06-28T06:32:00-07:00 Rating: 4.5 Diposkan Oleh: Andi Akbar