Membahas Blogger, Pada kali ini saya akan membuat tutoria dan Tips untuk anda semua untuk membuat navbar pada blogger. Navbar sendiri ini biasanya sudah ada pada template blog itu sendiri, namun sayang nya, banyak blogger yang kurang pas dengan desain vabar itu sendiri.
oleh karenan itu banyak blogger yang mengubahnya sendiri, dengan mengubah navbar itu, para blgger akan bisa menentukan, dan mempercantik tapilan dari blog itu sendiri.
Langsung saja kawan tanpa basa basi lagi kita simak tutorialnya.
Langkah langkah nya sebagai berikut
1. masuk ke blogger dan login dengan email gmail anda,
2. jika sudah masuk ke blogger, pilih menu template > Edit Html
3. JIka sudah masuk ke editor template, anda masukkan kata pencarian dengan cara meneka tombol Ctrl+f lalu masukkan kata pencarian anda yaitu </head>
4. Jika anda sudah ketemu copy dan pastekan kode dibawah ini, tepat diatas kode </head>
/*--------------------------------------------------------------
Kustomisasi Bilah Menu Navigasi Di Atas Header Halaman Blog
Oleh: Zulfikar Ilham Febrianto
Blog: tulisansibocahdungu.blogspot.com
URL : https://tulisansibocahdungu.blogspot.com
--------------------------------------------------------------*/
.bilah-menu-atas {
width: 100%;
min-width: 960px;
position: fixed;
top: 0px;
left: 0px;
right: 0px;
height: 45px;
font-size: 13px;
z-index: 99;
white-space: nowrap;
background-color: rgb(90, 152, 252);
background-image: -moz-linear-gradient(center top , rgba(62, 96, 93, 0.91) 100%);
box-shadow: 0px 2px 0px rgb(14, 180, 140);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.kolom-utama {
-moz-transition: all 0.2s linear 0s;
width: 960px;
height: auto;
margin: 0px auto;
}
.kolom-menu {
width: 521px;
height: auto;
margin: 0px 0px 0px -41px;
float: left;
display: inline;
}
.kolom-menu ul {
height: auto;
margin-top: 0px;
}
.kolom-menu ul li {
float: left;
position: relative;
list-style: none outside none;
}
.kolom-menu ul li:first-child {
border-left: 1px solid rgba(30, 30, 30, 0.125);
}
.kolom-menu ul li a {
color: #ffffff;
font-weight: bold;
text-shadow: -1px -1px rgba(0, 0, 0, 0.2);
text-decoration: none;
display: inline-block;
padding-top: 15px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
position: relative;
border-right: 1px solid rgba(30, 30, 30, 0.125);
box-shadow: 1px 0px 0px rgba(255, 255, 255, 0.1);
}
.kolom-menu ul li a:hover, .kolom-menu ul li a:focus {
background-color: rgba(255, 255, 255, 0.125);
}
5. jika sudah meng- copy dan paste kode diatas, lalu kembali masukkan kata pencarian dengan cara menekan Ctrl+f , lalu cary kata kunci <body
6. Jika Sudah Ketemu Silahkan copy & pastekan kode dibawah tepat pada dibawah kode ,body tadi.
<div class='bilah-menu-atas' id='bilahmenuatas'>
<div class='kolom-utama'>
<div class='kolom-menu'>
<ul>
<li><a href='https://tulisansibocahdungu.blogspot.com'><img alt='L3' height='15px' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEN0QiaEKw9Z4ZUZrOSyhCW9Msu2W2dsbU5gqdecCMBaYZbVmjRCttuoejFpkTiOcP2qay0Hn9FD60d7-gLiU2n4UCZ9zj_qUly7VR3Ot81yEIaxltuEMGf09VLnJ0nioTKhW6Qj9oB9c/s800/Beranda.png' width='20px'/></a></li>
<li><a href='https://tulisansibocahdungu.blogspot.co.id'>NEWS</a></li>
<li><a href='https://tulisansibocahdungu.blogspot.co.id/search/label/TUTORIAL?max-results=4'>TUTORIAL</a></li>
<li><a href='https://tulisansibocahdungu.blogspot.co.id'>TIPS AND TRICK</a></li>
<li><a href='https://tulisansibocahdungu.blogspot.co.id/2016/12/about.html'>ABOUT</a></li>
</ul>
</div>
<div class='kolom-menu'>
<ul style='float: right'>
<li><a href='URL'>Facbook</a></li>
<li><a href='URL'>Twitter</a></li>
</ul>
</div>
</div>
</div>
7. Jika Sudah jangan lupa untuk Menyimpannya, jika anda sudah menyimpannya silahkan anda lihat blog anda sendiri, pasti navbar baru akan muncul pada blog anda.
Note : Cara Ini adalah cara yang saya gunakan pada blog saya, apabila ada yang gagal, coba silahkan cek apakah anda sudah benar2 betul meletakkan kode seperti tutorial diatas.
Mungkin itu saja yang dapat saya sampaikan kawan, kurang lebihnya mohon maaaf, apabila ada saran harap masukkan komentar anda dibawah.
