Jika Iya,maka Postingan ini jawabannya
Bukan hanya Membuat Tombol Navigasi Di atas Header Blog saja tetapi saya akan memberitahukan 3 cara Membuat Tombol Navigasi Laman
Iya memang panjang tapi sebelum membuatnya sebaiknya kita harus tahu dulu apa manfaat dari Membuat Tombol Navigasi Menu Laman
Wedeh Kayaknya bakal panjang nih
Pertama Memudahkan pengunjung dalam Mencari informasi tentang blog kita
Kedua Kita bisa mengedit Tombol Laman untuk dialihkan ke Link dari Artikel Andalan Kita
Ketiga Bisa Menjadikan blog kita lebih profesional
Keempat Membuat Tampilan dari blog kita menjadi lebih menarik
Oke kalau anda sudah tahu manfaatnya,selanjutnya berikut ini 3 Cara Membuat Tombol Navigasi Menu Laman Pada Blog
Membuat Tombol Navigasi Menu Diatas Header Blog
Seperti yang dilingkari merahBaiklah Pertama Saya akan memberitahukan cara membuat Tombol Navigasi Menu Diatas Header Blog.
Buka Dashboor Blog kamu lalu Klik Template dan Setelah itu Klik Edit HTML
Selanjutnya
Pertama Tarus code diatas ]]></b:skin>
/* Topbar Navmenu */Ubahlah tulisan yang berwarna merah dengan warna yang cocok untuk background kamu.
ul.topnav {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: black;
}
ul.topnav li {float: left;}
ul.topnav li a {
display: inline-block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
transition: 0.3s;
font-size: 17px;
}
ul.topnav li a:hover {background-color: orange;}
ul.topnav li.icon {display: none;}
@media screen and (max-width:680px) {
ul.topnav li:not(:first-child) {display: none;}
ul.topnav li.icon {
float: right;
display: inline-block;
}
}
@media screen and (max-width:680px) {
ul.topnav.responsive {position: relative;}
ul.topnav.responsive li.icon {
position: absolute;
right: 0;
top: 0;
}
ul.topnav.responsive li {
float: none;
display: inline;
}
ul.topnav.responsive li a {
display: block;
text-align: left;
}
}
Kamu bisa mengubahnya dengan warna berbahasa inggris,bisa red,blue,orange atau yang lain karena warna background tampilannya akan seperti dibawah ini
Lalu Ubahlah tulisan yang berwarna biru dengan warna yang cocok untuk tampilan blogmu,sama seperti cara diatas dengan mengubah warna berbahasa inggris,bisa red,blue,orange atau yang lain karena bila kursor diarahkan ke salah satu menu akan seperti ini
Atau kamu bisa gunakan seperti code diatas saja agar hasilnya sama kayak digambar
Kedua taruh code ini di bawah<body>
<ul class="topnav" id="myTopnav">Ubahlah yang berwarna merah dengan link dari setiap lamanmu,atau kamu juga bisa mengedit about,sitemap,kontak,disclaimer dengan kata-kata sesukamu tapi kalau kamu belum membuat laman kamu bisa baca dibawah ada informasi tentang membuat laman
<li><a href="/">Home</a></li>
<li><a href="/p/about.html">About</a></li>
<li><a href="/p/sitemap.html">Sitemap</a></li>
<li><a href="/p/kontak.html">Kontak</a></li>
<li><a href="/p/disclaimer.html">Disclaimer</a></li>
<li class="icon">
<a href="javascript:void(0);" onclick="myFunction()">☰</a>
</li>
</ul>
Ingat ganti yang berwarna merah dengan link dari setiap halaman yang ingin kamu tuju
Ketiga Taruh Kode ini diatas </body>
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
</script>
Selesai,sekarang Kamu sudah bisa membuat Tombol Navigasi Menu Diatas Header Blog dan saya ucapkan terima kasih kepada www.contohblog.com sebagai sumber ilmu dari membuat Tombol Navigasi Menu Diatas Header
Membuat Tombol Navigasi Menu Di Header Blog
Kedua saya akan Membuat Tombol navigasi Menu Di header Blog tetapi ini digunkan untuk anda yang menggunakan template dari blogger
Pertama kamu harus sudah mempunyai Laman Kontak,Kebijakan Privasi,Daftar Isi,Syarat dan Ketentuan,seperti yang dibundari
Bila anda belum membuat laman tersebut kalian bisa baca ini (Cara membuat Laman Kontak , Cara Membuat Laman Kebijakan Privasi , Cara Membuat Laman Syarat dan Ketentuan , Cara Membuat Daftar Isi) untuk membuatnya
Oke kalau kamu sudah membuat Laman maka selanjutnya Klik Tata Letak lalu Klik Tambah Gadget pada gambar yang dilingkari seperti dibawah ini
Selanjutnya kamu akan mebuka jendela baru seperti dibawah ini dan pilih Laman seperti yang dilingkari
Setelah itu kamu checklist semua dan klik simpan seperti gambar dibawah ini
Atau kamu ingin menambahkan Link halaman lain,kamu bisa klik Tambah tautan Eksternal,Jika kamu sudah melakukan semua itu makan hasilnya akan seperti dibawah ini
Selesai,sekarang kamu sudah bisa membuat Tombol Navigasi Menu di Header Blog
Membuat Tombol Navigasi Menu Pada Footer Blog
Untuk Membuat Tombol Navigasi Menu Pada Footer Blog seperti yang dilingkari diatas,ikutilah langkah-langkah berikut iniPertama Buka Blog kamu dan Klik Tata Letak dan arahkan kebawah lalu pilih Tambah Gadget seperti gambar dibawah ini
Setelah itu kamu akan masuk ke halaman gadget dan pilih HTML/Javascript
Setelah itu copy sript dibawah ini
<div style="text-align: center;"><a href="http://dirawan7.blogspot.co.id/p/kontak-saya.html">Kontak Saya||</a>Ganti tulisan yang berwarna merah dengan URL dari Laman yang telah kamu buat,Setelah itu biarkan saja judulnya dan klik Simpan
<a href="http://dirawan7.blogspot.co.id/p/kebijakan-privasi-untuk-httpdirawan7.html">Kebijakan Privasi||</a>
<a href="http://dirawan7.blogspot.co.id/p/syarat-dan-ketentuan-httpdirawan7.html">Syarat dan Ketentuan
</a>
</div>
Udah gitu doang gan?
Yap!!! Memang cuman seperti itu
Itu dia 3 Cara membuat Tombol Navigasi Laman Pada Blog ,Semoga dapat bermanfaat bagi anda dan saya ucapkan terima kasih
0 comments:
Post a Comment