Membuat menu navigasi tanpa coding

Cara membuat menu di bawah header, menu, tab menu, tutorial, tips blog
Tab menu
Sebuah blog tanpa navigasi yang bagus ibarat peta buta. Bisa saja pembacavmampir ke blog, tapi habis itu dia langsung pergi. Sayang kan, kalau kamu punya artikel bagus-bagus dan bermanfaat tapi teronggok begitu saja.
Fungsi navigasi pada blog yang paling umum adalah label, kategori, atau archive. ternyata, fungsi itu belum cukup. Keberadaan menu di bawah header akan mempermudah pembaca berpindah dari satu artikel ke artikel lain. Apalagi, saat ini pembaca blog lebih banyak memakai versi mobile. Label dan arcive tidak cocok ditampilkan pada versi mobile, berbeda dengan bilah menu yang biasanya terletak di bawah header. Cukup mudah membuat menu ini, tidak perlu coding. 
Untuk Blogspot
Tutorial ini saya buat untuk blog berjenis blogspot dengan template bawaan blogger. Jika blogmu memakai template unduhan atau  hasil beli, biasanya sudah tersedia. Kalau tetap mau mengaplikasikan ya bisa saja sih, tapi hapus dulu yang bawaan template lama agar tidak dobel. Yang saya maksud menu di sini adalah menu yang berasal dari label. Seperti contohnya di blog ini, ada menu #traveling yang saya ambil dari label traveling.
Tutorial membuat menu di bawah header
1| Pertama-tama kamu harus menentukan mau membuat menu apa. Yaiyalah, masa mau tanpa nama..blogger nya bingung dong
Cara membuat menu di bawah header, menu, tab menu, tutorial, tips blog
Pilih tata letak lalu pages
2| Bukalah halaman dasbor blogger. Lebih leluasa lewat PC ya, kalau saya lewat smartphone agak kecil-kecil gitu jadinya. 
3| cek sebelah kiri, ada tulisan “tata letak” atau “layout” klik deh
4| ketemu menu pages? Klik edit di sebelah kanan bawah
5| klik pada tulisan berwarna biru “eksternal link”
Cara membuat menu di bawah header, menu, tab menu, tutorial, tips blog
Masukkan eksternal link
6| masukan nama menu, misalnya “traveling”
Bikin menunya nih
7| masukan link nya, caranya gimana? Buka blogmu, cari label yang dimaksud. Misalnya, label “traveling”. Klik kanan pada “travelink” lalu pilih “copy link address”. 
8| Kembali ke tab “tata letak” di dasbor (nomor 6), paste ke kolom yang tersedia
9| save
10| save
11| cek hasilnya dengan membuka “home” blog kamu
Mudah sekali bukan cara membuatnya? Tanpa coding sama sekali, cocok buat newbie.
Menghapus menu di bawah header
Kalau hasil kerjamu kurang ok, atau kamu mau mengganti nama menu gimana? Gampang kok.
1| Bukalah halaman dasbor blogger. 
2| cek sebelah kiri, ada tulisan “tata letak” atau “layout” klik
3| ketemu menu pages? Klik edit di sebelah kanan bawah
4| ketemu list menu kamu? Klik tanda “x” pada menu yang ingin dihapus
Cara membuat menu di bawah header, menu, tab menu, tutorial, tips blog
Klik “x”
Navigasi lain
Selain tab menu, label, archive, ada juga widget tambahan seperti “linkwithin” dan “engageya” yang digunakan untuk menampilkan artikel terkait. Tapi, tab menu di bawah header ini yang menurut saya paling cocok dimasukkan dalam tampilan mobile. Tidak memberatkan dan tidak mengganggu kenyamanan pembaca blog. 
Selamat mencoba…terima kasih sudah membaca Monday NO Gaptek..

44 Replies to “Membuat menu navigasi tanpa coding”

  1. laili umdatul khoirurosida says: Balas

    Oh iya ya mending labelnya yang di jadikan menu.
    tapi eh. label ku udah terlalu banyak kayaknya buat di taruh di bawah menu

    1. Ga perlu semua mba…label yang utama aja..yg jadi fokus blog kita 🙂

  2. Djangkaru Bumi says: Balas

    oh ini maksudnya label yang jadi menu bukan laman yang dijadikan menu. Blogspot sekarang lebih mudah dipahami. semua orang bisa mengotak-atik dengan sendiri dan leluasa.

    1. Radja Blangkon says: Balas

      Aku juga masih setia dengan bawaan blogspot, pengen ganti yang lebih responsive belum menemukan template yang mantap dihati. Tapi ada rencana ganti seh, dan aku menggunakan laman halaman bukan label. Terasa berat loading karena penuh link.

    2. Iya..kalau laman, mungkin sudah banyak yang tahu. Dulu sih kalau mau bikin begini musti coding ya

    3. Jadi mau pakai tips ini? Hwheheh

  3. Bookmark. Aku berkali-kali gagal bikin kayak gini…hihi :p

    1. Monggo mbak..pelan pelan sana..

  4. Tri Wahyu Handayani says: Balas

    Makasih yaa infonya. Penting banget. Dari dulu nyari caranya. Soalnya bingung external linknya apa. Ngertinya ke alamat blog yg lain…

    1. Bisa sih diisi alamat blog lain

    2. Bisa sih diisi alamat blog lain

  5. Radja Blangkon says: Balas

    Hal yang sederhana tapi jarang orang yang tahu. Karena blogspot setiap tahunnya selalu ganti tampilan. Bikin orang atau master yang membahas seluk beluk blog jadi kelimpungan.

    1. Sering diabaikan… 🙂

  6. Siti Mudrikah says: Balas

    Aku lagi nyari ini, thanks mba nurul.

  7. Siti Mudrikah says: Balas

    Aku lagi nyari ini, thanks mba nurul.

    1. Begitukah? Alhamdulillah…semoga bermanfaat yaa

  8. Ngutak ngutik layout gini emang paling enak pake PC. Aku pake tablet, ga bergeser2 🙁
    Jadi malez deh

    1. Ini aku pakai hape layar 5.5 inch mba 🙂

  9. gore g lake coding hehehe.bookmark duluuu….

  10. Thanks tutorialnya Mbak. Aku ada blog di BP tapi jarang kuotak-atik sih. Mungkin ntr berguna nih thx

    1. Semoga bermanfaat yaaa

  11. Suciati Cristina says: Balas

    Utak atik blog bisa makan waktu sendiri yaaa, kadang keasikan..

    1. Lupa waktu lupa daratan hahaha

  12. Aku lagi pengen buat submenu Nay, biar templatenya kayak yang beli-beli itu

    1. Ciyee…
      Aku udah beberapa kali pakai. Harus coding sih, tapi jadi kurang simpel

  13. Aira Kimberly says: Balas

    Keren tutorialnya,trims sudah berbagi ^_^