Cara Membuat Navigasi Menu Template Evo Menyatu Kesamping
Kali Saya kembali lagi mencoba Iseng – Iseng Modifikasi Template Evo Magz dimana salah satu hal yang akan sedikit Saya rubah/modifikasi adalah bagian navigasi menunya. Saya kurang tahu bahasa yang benar atau tepat untuk menggambarkan apa yang akan Saya sampaikan ini, tapi yang jelas disini Saya ingin membuat Menu Template Evo Magz menjadi menyatu kesamping, full kesamping layar pengguna, seperti layaknya pada tampilan navigasi menu facebook atau twitter.
Saya ingin membuat menu tersebut menjadi full kesamping tanpa ada pembatas karena Saya pikir bentuk menu navigasi seperti itu lagi ngetrend atau populer, kebanyakan situs – situs besar juga menunya dilebarkan kesamping, menempel mengikuti layar pengguna.
Bila diperhatikan memang menu navigasi template Evo Magz itu ada jarakanya, antara layar pengguna dengan bilah menu seperti yang terlihat pada gambar dibawah ini
Saya ingin membuat menu tersebut menjadi full kesamping tanpa ada pembatas karena Saya pikir bentuk menu navigasi seperti itu lagi ngetrend atau populer, kebanyakan situs – situs besar juga menunya dilebarkan kesamping, menempel mengikuti layar pengguna.
Bila diperhatikan memang menu navigasi template Evo Magz itu ada jarakanya, antara layar pengguna dengan bilah menu seperti yang terlihat pada gambar dibawah ini
Oleh karena itu disini Saya ingin merubahnya, sehingga tidak ada jarak antara menu dengan sisi pinggir layar pengguna, atau nantinya menu jadi lebar menyatu kesamping.
Bagi orang seperti Saya yang sebenarnya tidak paham betul dengan CSS maka ini akan sedikit menyulitkan, tapi setelah beberapa kali mencoba akhirnnya Saya sedikit memahami bagimana cara untuk melakukannya.
Berikut ini adalah Cara Membuat Navigasi Menu Template Evo Menyatu Kesamping
- Seperti biasa masuk ke mode edit HTML
- Tekan CTRL+F lalau masukan baris #wrapper pada kolom pencarian
- Cari terus dan temukan sususnan kode ini
#wrapper {
margin: 0 auto;
} - Rubah kode tersebut jadi
#wrapper {
margin: 0;
padding: 0;
} - Bila berhasil maka nanti kurang lebih tampilannya akan terlihat seperti pada halaman berikut : LIHAT HALAMAN
Sekarangan selanjutnya supaya bagian postingannya tidak terlalu mepet ke kiri, Anda bisa mengatur bagian post-caontainer. Cari baris berikut
.post-container {
padding: 15px 15px 0 0;
}
Rubah/tambah baris diatas menjadi seperti berikut
.post-container {
padding: 15px 15px 0 10px;
}
Sebenarnya tidak dirubah juga tidak apa – apa, hanya kalau Anda “merasa” jaraknya terlalu mepet kesamping maka Anda bisa mengatur kode diatas.
Seorang laki - laki biasa yang senang duduk sendirian di pinggir pantai, pengagum embun pagi dan lembayung senja, suka blogging, coding dan jogging. Moto hidupnya adalah hidup santai dan simple
Kalau menurut saya jadinya malah tambah keren ya kang. Nanti kalau pakai template ini mau ikutan nyoba deh. Oh ya, kalau di template selain evo magz apa bisa juga kang?
ReplyDeletebisa dong,, tinggal atur marginnya,,
DeleteKalau bisa nanti mau nyoba deh kang
Deletemasih belum paham yang mananya yang berubah kang
ReplyDeleteSempat lama aku memahami maksud yang disampikan oleh admin.
ReplyDeleteSetahuku menu itu halaman laman, umumnya dibawah header.
Ternyata maksudnya lebar body.
Wrapper yang aku tahu lebar body.
Tapi kalau aku lihat dengan komputerku disini tidak ngaruh tetap ada jaraknya.
Saya juga udah liat dan coba pake laptop,, ternyata emang kagak ngaruh,, kalau pake layar lcd biasamah,, emang lebarnya jadi full
Deleteoh kesamping, supaya kayak navigasi di hanphone ya kang
ReplyDeleteini pengaturan jarak antara menu navigasi ke navigasi disampingnya nya mas??
ReplyDeleteHallo mas, kenapa tinggi evomagz ngga ngepas di layar ya kalo dibuka via PC?
ReplyDeleteKaya di blog ini juga, di bawah footer ada space kosong, begitu juga di atas header, intinya ngga ngepas di layar.
Saya udah otak atik ga nemu solusi mas, mohon bantuannya, soalnya kalo minta bantuan ke yg jual template jelas ngga dikasih wkwk
Thank you mas, salam.