Kali ini saya akan share sebuah template yang dalam hitungan saya ini seo dan responsive (tentunya dengan menggunakan testernya masing-masing),
Cek Seo
Cek Responsive
Cek Mobile Friendly untuk id-mufcnews.blogspot.com
Oke silahkan cek link berikut :
Saya menggunakan Framework Bootstrap dalam template ini, jadi ada fitur-fitur yang dapat kawan gunakan, yang anda bisa lihat disini http://getbootstrap.com/components/.
Disana kamu dapat melihat berbagai contoh penggunaan komponen-komponen bootstrap.
Meta Tag
Jangan lupa untuk mengubah Meta Tag yang berada didalam baris 17 - 90, silahkan diisi sesuai dengan fungsi meta tag masing-masing, jika masih kesulitan, silahkan tanyakan dibawah.
Menu Navigasi Hamburger
Menu hamburger yang saya maksud adalah menu yang berada di pojok kiri header, untuk mengubah isi menu silahkan ubah kode yang berwarna merah berikut.
<div class='navup'>
<div class='text-left' style='float:left'>
<button id='tombol1'><span class='fa fa-bars'/></button>
<div class='collapse' id='buka'>
<ul class='daftartaut list-unstyled'>
<li><a href='#'>About</a></li>
<li><a href='#'>Contact</a></li>
<li><a href='#'>Faq</a></li>
<li><a href='#'>Partner</a></li>
</ul>
</div>
</div>
Deskripsi
Deskripsi bisa anda ubah melalui kode berikut.
<span class='desk'>Brayen-Man Home Coming</span>
Menu Navigasi Dropdown
Menu ini memiliki fitur multi dropdown, saya sudah berikan demonya dalam link hosting-/bundling, untuk mengubahnya silahkan ubah kode yang saya tandai dibawah ini.
<nav class='menu1' id='menu1' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>
<a class='responsive-menu' href='#' id='resp-menu'><i class='fa fa-bars'/> Menu</a>
<ul class='menu'>
<li><a href='/'>HOME</a></li>
<li><a href='http://id-mufcnews.blogspot.co.id/p/blog-page_16.html'>STATIC PAGE</a></li>
<li><a href='http://id-mufcnews.blogspot.co.id/404'>ERROR 404</a></li>
<li><a href='#'>HOSTING</a>
<ul class='sub-menu'>
<li><a href='#'>250 mb</a></li>
<li><a href='#'>Bundling</a>
<ul>
<li><a href='#'>Website + 1000mb</a></li>
<li><a href='#'>Website + 1500mb</a></li>
<li><a href='#'>Website + Unlimited + .com</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='#'>OTHER</a>
<ul class='sub-menu'>
<li><a href='#'>Contact Us</a></li>
<li><a href='#'>Affiliate</a></li>
<li><a href='#'>Job</a></li>
</ul>
</li>
</ul>
</nav>
Link Footer
Tepatnya, daftar link ini berada diatas footer, saya menggunakan Grid System-nya Bootstrap, System Grid Bootstrap secara full memiliki 12 kolom dan kamu cuma bisa menggunakan kurang/pas12 kolom namun tidak bisa lebih, sebagai bayangan saya menggunakan ruang 4 kolom untuk form Subscribe, 2 kolom untuk Daftar Link 1, 2 kolom untuk Daftar link 2, dan 4 kolom untuk recent posts, jika dihitung saya menggunakan semua ruang kolom yaitu 12, saya harap anda punya sedikit bayangan atau lebih lengkapnya silahkan kunjungi http://getbootstrap.com/css/#grid.
Untuk mengubahnya sama seperti contoh diatas, kamu bisa mengubah link yang berada didalam <div class='bloginfo'>..</div>.
Untuk yang merasa gengsi untuk menggunakan link footer, anda bisa membeli premium dengan menghubungi saya di form contact dibawah
Selesai, untuk menghargai sebuah karya saya harap credit link tidak diganggu, atau anda bisa baca tulisan diatas. Sekian, semoga bermanfaat.
