Untuk mempermudah Anda memahaminya maka saya akan membaginya menjadi tiga bagian.
- Menambahkan Slot Iklan
Cari div dengan selector content-outer lalu pastekan kode html ini <div class="slotiklan">Advertisement 728x90</div> dibawahnya content-outer.
Selanjutnya kita tambahkan CSSnya..slotiklan {
border: 1px solid gainsboro;
height: 90px;
background-color: #FDF5F5;
border-bottom: 0;
font-size: 20px;
padding-left: 60px;
line-height: 90px;
} - Menambahkan Menu Help
Letakan kode dibawah ini, tepat dibawahnya div slot iklan tadi.<div id="navbarfirst">
<ul>
<li><a href="">About Us</a></li>
<li><a href="">Sitemap</a></li>
<li><a href="">Contact Us</a></li>
</ul>
<div>
Lalu kita permak dengan CSS seperti ini.#navbarfirst {
background: white;
padding: 5px;
border: 1px solid gainsboro;
border-bottom: 0;
padding-left: 515px;
height: 40px;
}
#navbarfirst ul li {
float: left;
list-style-type: none;
padding-left: 33px;
font-size: 14px;
} - Menambahkan Menu Navigasi
Menu navigasi ini akan kita letakkan dibawah header (judul blog), maka kita cari dulu </header> dan masukkan kode html unyuk membuat navigasi dibawah ini.<div id="navbarsecond">
<ul>
<li><a href="">SEO Lokal</a></li>
<li><a href="">SEO Manca</a></li>
<li><a href="">SEO Tips</a></li>
<li><a href="">SEO Kawe</a></li>
<li><a href="">SEO Sawang</a></li>
<li><a href="">SEO Sumber</a></li>
<li><a href="">SEO Google</a></li>
</ul>
</div>
Selanjutnya kita cari lagi </b:skin>, dan letakkan css dibawah ini tepat diatasnya kode </b:skin>.#navbarsecond {
border-bottom: 1px solid gainsboro;
height: 30px;
padding-left: 50px;
}
#navbarsecond ul li {
float: left;
list-style-type: none;
padding-right: 40px;
font-size: 14px;
}
- Menambahkan Slot Iklan
