Cara membuat menu navigasi di blogger

Cara membuat menu navigasi di blog - Membuat menu bar di header blog merupakan hal yang paling banyak dilakukan oleh para pemula sampai para pakar web atau webmaster. Menu bar di header sebenarnya adalah menu navigasi yang kita sediakan untuk pengunjung blog. Banyak blogger pemula (newbie) termasuk saya nih belum mengerti apa sebenarnya arti dan fungi menu navigasi di bawah header. Untuk itu yang paling penting dan paling utama, kita harus mengetahui terlebih dahulu apa tujuan kita memasang menu bar di blogspot.

Apa tujuan menu navigasi di blog?

Seperti yang saya janjikan diatas. Kita harus menegetahui tujuannya terlebih dahulu. Berikut penjelasan mengenai apa tujuan kita memasang menu navigasi di header blog kita.

1. Memudahkan mesin telusur.

Menu navigasi sangatlah penting bagi mesin telusur. Dengan navigasi di blog kita, mesin telusur akan dengan mudah mencari apa saja isi konten blog kita. Perlu kita ketahui dalam membuat blog kita harus mementingkan pengunjung. Dalam hal ini Mesin Telusur atau Mesin Pencari saya kategorikan sebagai pengunjung juga. Bagaimana kita harus melayani pengunjung blog kita? haruslah dengan pelayanan yang baik. Jika blog kita mempunyai navigasi yang baik, maka blog kita akan disukai mesin telusur dan akan menjadi prioritas dalam pencarian.

2. Memudahkan pengunjung blog

Pengunjung adalah hal yang paling diutamakan. Bagaimana caranya agar pengunjung merasa mudah dan nyaman. Agar pengunjung betah berlama-lama di blog sobat. Perlu sobat ketahui, lamanya pengunjung membuka blog sobat menjadi salah satu penentu tingkat trafik blog sobat. Jika pengunjung datang dan pergi dengan cepat, berarti blog sobat tidak memiliki informasi dan pelayanan yang baik kepada pengunjung.

Saya ibaratkan blog itu seperti supermarket, tentunya isi dari supermarket itu sangat banyak. Pengunjung supermarket harus dipentingkan. Apabila sobat mempunyai supermarket dan menaruh barang bercampur aduk dan tempatnya tidak tidak menentu maka akan menyusahkan pengunjung supermarket. Misalnya mereka ingin mencari Sabun Cuci, mereka harus mencari satu persatu di dalam supermarket yang luas. Untuk itu kita harus mengelompokkan barang sesuai jenisnya dan kegunaannya.

Begitu pula dengan blog kita harus mengelompokkan artikel dan membuat navigasi. Tujuan membuat menu navigasi bagi pengunjung yaitu: Untuk memudahkan pengunjung mengeksplorasi blog kita, berpindah dari halaman satu ke halaman yangh lainnya yang berisi konten spesifik yang pengunjung butuhkan. 

3. Memanfaatkan Ruang di bawah Header

Jika kita tidak mengisi bagian di bawah header blog, maka akan terjadi kekosongan. Mengapa kita harus mengosongkannya?  Padahal kita dapat mengisinya dengan hal yang lebih berguna bagi pengunjung blog kita.

4. Tampilan lebih berkesan

Bagi blog pemula nih, tujuan ini yang paling diperhatikan. Tidak ada salahnya juga. Dengan memasang menu navigasi di blog kita akan membuat tampilan blog kita menjadi lebih berkesan terlebih lagi menjurus ke arah kata keren. Ini akan membuat pengunjung sobat menjadi terkesan dan akan kembali mengunjungi blog sobat.

# Cara membuat menu bar di blogspot dengan mudah

Lalu, banyak yang bertanya-tanya bagaimana cara membuat menu navigasi di blog? apa yang harus kita siapkan? apa yang harus kita lakukan? berikut adalah Cara membuat menu bar di blogspot dengan mudah. Dengan memanfaatkan widget yang ada di blogger.com. Baca sampai habis ya sob.

Oke misalnya saya mempunyai tampilan blog seperti di bawah ini. Blog ini tidak memiliki menu dibawah header blog. Hanya berisi satu artikel, dua widget di sidebar yaitu arsip blog dan profil. Saya akan membuat menu navigasi di bawah header blog ini.

Berikut langkah-langkah membuat menu navigasi di blog:

1. Silahkan menuju blogger.com kemudian sign in di blog sobat.

2. Buka halaman dasboard kemudian klik Layout. Kemudian klik add widget pada bagian bawah header lihat gambar yang di lingkari merah.

3. Kemudian cari widget Pages. Klik ikon tambah untuk menambahkan pages  ke halaman blog sobat.

4. Pada bagian bawah Page to Show  klik add external link untuk menambahkan menu blog. Misalnya saya akan menambahkan alamat ke halaman facebook saya dan mengisi URL ke halaman facebook saya seperti contoh berikut. Kemudian klik Save Link. 

5. Untuk menambahkan lebih banyak menu silahkan ulangi langkah ke 4. Setelah selesai, langkah terakhir klik Save. Berikut tampilan hasi penambahan page di blogger.com

# Cara membuat menu navigasi dengan kode

Tujuannya tetap sama yaitu membuat menu dibawah header. Namun langkah langkanya yang berbeda mungkin cara berikut sulit bagi pemula seperti saya. Tapi sebenarnya tidak terlalu susah, oke berikut langkah-langkahnya:

1. Silahkan sign in di blogger.com kemudian buka blog sobat. Pada menus dashboard klik menu Template kemudian klik Edit HTML.

2. Cari kode ]]></b:skin> dengan CTRL + F lalu ketik kode tersebut. setelah di temukan, Copy kode berikut kemudian letakkan di atas kode ]]></b:skin> 

/*Top Menu*/
#top{margin:auto;padding: 0;width: 950px;background:#eeeded;border-bottom:1px solid #ddd;}
#top-wrap{margin:auto;padding: 0;width: 950px;background:#eeeded;}
#navwrap {margin: 0px auto; width:560px; float:left;background:#080705;}
.topnav ul {list-style:none;margin:0;padding:0px; float:left;}
.topnav li {float:left;margin:0;text-align:center;}
.topnav li a {font-family: arial; font-weight:bold; font-size:11px;display:block;padding:10px 10px;color:#222;text-decoration:none; text-transform:uppercase;}
.topnav li a {background:none; }
.topnav li a:hover, li a:focus, li a:active {text-decoration:none; background:#ffffff; color:#000000;}}
#navbar-iframe {display: none !important;}

 Catatan.
Silahkan ganti nilai width: 950px sesuai lebar blog sobat
Silahkan ganti kode warna background:#eeeded sesuai yang sobat inginkan.
Silahkan ganti warna tulisan color:#222 jika sobat inginkan.

3. Langkah selanjutnya yaitu cari CTLR+F kode </head> atau <body> kemudian copy lalu paste  kode berikut tepat dibawah kode  </head> atau <body>

<div id='top'>
<div id='top-wrap'>
<div class='topnav'>
<ul id='topnav'>
<li><a href='http://qodia.blogspot.com/' title='Top Menu'>Top Menu</a></li>
<li><a href='http://qodia.blogspot.com/' title='Contact'>Contact</a></li>
<li><a href='http://qodia.blogspot.com/' title='Disclaimer'>Disclaimer</a></li>
<li><a href='http://carawoles.blogspot.com/' title='Privacy Policy'>Privacy Policy</a></li>
<li><a href='http://qodia.blogspot.com/' title='Facebook'>Facebook</a></li>
<li><a href='http://qodia.blogspot.com/' title='Twitter'>Twitter</a></li>
<li><a href='http://qodia.blogspot.com/' title='Google Plus'>Google Plus</a></li>
</ul>
</div>
</div>
<div style='clear: both;'/>
</div>

Catatan
Silahkan ganti http://qodia.blogspot.com/  dengan alamat yang sobat inginkan dan ganti Top Menu dengan judul menu navigasi yang sobat inginkan.

4. Klik Save Template. Selesai

Demikian Cara membuat menu navigasi di blog semoga bermanfaat. terima kasih

Tweet

Artikel keren lainnya:

Ditulis oleh famadaya pada hari Friday, January 16, 2015