Sunday, December 22, 2019

√ Cara Paling Praktis Menciptakan Navigasi Sajian Di Atas Header Blog

Navigasi Menu Diatas Header biasanya di isi dengan hidangan menyerupai contact, privacy policy, disclamer dan about us. Selain itu, dengan memasang hidangan navigasi ini penampilan blog anda akan terlihat lebih bagus dan menarik dn tentu saja terliht profesional. Bagaimana, apakah anda ingin memasangnya juga? Baiklah...Tanpa banyak bertele-tele lagi, ikuti cara paling praktis menciptakan navigasi hidangan di atas header berikut ini.


1. Seperti biasa, langkah pertama anda login dulu ke Blogger

2. Pilih Template » Edit HTML

3. Sekarang anda cari arahan ]]></b:skin>

4. Pasang arahan berikut diatas arahan ]]></b:skin>

/*Kang AP Top Menu*/

#top{margin:auto;padding: 0;width: 95%;background:#e5e5e5;border:2px solid #e5e5e5;}

#top-wrap{margin:auto;padding: 0;width: 1000px;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:#000000;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:#e5e5e5; color:#000000;}

#navbar-iframe {display: none !important;}

Baca juga :
» Cara Praktis Cara Membuat Kolom Permalink Keren
» Cara Agar Postingan Blog Cepat Terindek
» Cara Praktis Memasang Emoticon Pada Kolom Komentar Blog

Note. » Untuk lebar dan warna background silahkan sesuaikan dengan template blog anda

5. Kemudian cari arahan </head>

6. Pasang arahan berikut dibawah arahan </head>


<div id='top'>

<div id='top-wrap'>

<div class='topnav'>

<ul id='topnav'>

  <li><a href='https://ap-thea.blogspot.com' title='Home'>Home</a></li>

<li><a href='https://ap-thea.blogspot.com/p/kontak.html' title='Contact'>Contact</a></li>

<li><a href='https://ap-thea.blogspot.com/p/disclaimer.html' title='Disclaimer'>Disclaimer</a></li>

<li><a href='https://ap-thea.blogspot.com/p/privacy-poli.html' title='Privacy Policy'>Privacy Policy</a></li>

<li><a href='https://ap-thea.blogspot.com/p/about.html' title='Tentang Kami'>About</a></li>

<li><a href='https://ap-thea.blogspot.com/p/pasang-iklan.html' title='Pasang Iklan'>Pasang Iklan Murah</a></li></ul>

</div>

</div>

7. Simpan Template dan lihat hasilnya

Bagaimana? mudahkan cara menciptakan navigasi hidangan di atas header, agar artikel ini dapat bermanfaat. Jika anda memiliki pertanyaan mengenai artikel ini, silahkan curahkan di kolom komentar. Terima kasih.


Sumber http://ap-thea.blogspot.com


EmoticonEmoticon