Iklan

Halaman

Cara Membuat Menu Navigasi Keren pada Blogspot : Tutorial Lengkap

Kamis, 11 Mei 2023, Mei 11, 2023 WIB Last Updated 2023-05-11T11:16:43Z

 


Kangbadar.com - Menu bar pada sebuah blog atau website merupakan salah satu elemen yang sangat penting untuk memberikan kemudahan bagi pengunjung dalam navigasi halaman-halaman yang tersedia. Dalam artikel ini, saya akan memandu anda langkah demi langkah untuk membuat menu bar keren pada platform Blogspot.


  • Pertama-tama, login ke akun Blogger anda dan pilih blog yang ingin anda tambahkan menu bar pada halamannya.
  • Pilih Layout pada menu utama, lalu klik "Add a Gadget" pada tempat dimana anda ingin menempatkan menu bar. Biasanya, menu bar diletakkan di header atau sidebar.
  • Pilih gadget "HTML/JavaScript" dari daftar yang tersedia.
  • Selanjutnya, anda akan memasukkan kode HTML dan CSS untuk membuat menu bar. Kode tersebut dapat anda buat sendiri atau menggunakan template yang sudah tersedia. Berikut ini adalah contoh kode HTML dan CSS untuk membuat menu bar sederhana:


#html


<ul class="menu">

  <li><a href="#">Beranda</a></li>

  <li><a href="#">Tentang Kami</a></li>

  <li><a href="#">Kontak</a></li>

</ul>



#css


.menu {

  list-style: none;

  margin: 0;

  padding: 0;

  background-color: #333;

  overflow: hidden;

}


.menu li {

  float: left;

}


.menu li a {

  display: block;

  color: white;

  text-align: center;

  padding: 14px 16px;

  text-decoration: none;

}


.menu li a:hover {

  background-color: #111;

}



  • Setelah anda memasukkan kode tersebut, klik "Save" dan lihat hasilnya pada blog anda. Anda dapat menyesuaikan kode tersebut dengan warna dan font yang anda inginkan untuk membuat menu bar menjadi lebih keren.


Dengan mengikuti langkah-langkah di atas, anda dapat membuat menu bar keren untuk blogspot anda dengan mudah dan cepat. Selamat mencoba!

Komentar

Tampilkan

Terkini

Nasional

+