Cara Merubah Header Evo Jadi Ke Tengah Responsive Bag Ii

Pada peluang sebelumnya Saya pernah mengambarkan tentang Teknik Merubah Posisi Header Gambar Template Evo Magz ke Tengah , dengan mengatur batas margin kiri atau jarak header dari samping lalu juga melaksanakan abolisi terhadap widget header-right. 

Ternyata sehabis Saya pelajari kembali,  cara sebelumnya cukup menggelikan dan terkesan membuang - membuang waktu, dan risikonya kurang memuaskan alasannya ialah pada ketika layar diperkecil tampillan headernya justru kurang responsive. Akhirnya kini Saya coba kembali Iseng - Iseng Modifikasi Template Evo Magz lagi

Anda juga bahwasanya tidak perlu menghapus bab widget header right, tapi kalau dihapus pun juga tidak mengapa, tapi kalau nanti posisi header ingin dikembalikan ke tiruanla, tentunya Anda harus melaksanakan penambahan widget lagi, maka dari disini Saya tidak akan menghapus widget header right, namun justru disini Saya akan memanfaatkan class header-right  dan dimenambahkan ke class header

Merubah posisi header template evo magz jadi ke tengah caranya cukup gampang, diberikut ialah langkah - langkahnya

1. Masuk ke blog masing - masing dan lakukan edit HTML
2. Tekan CTRL+F masukan kata header dan tekan enter
3. Hentikan pencarian kalau sudah ditemukan baris diberikut <header id="header-wrapper"><b:section class="header section" id="header">
   
4. Ganti script <b:section class="header section" menjadi <b:section class="header-right" menyerupai yang terlihat pada gambar diatas
5. Bila berhasil nanti kurang lebih tampilannya menyerupai yang terlihat pada gambar dibawah ini
   

 [ LIHAT DEMO ]

Karena kini sudah memakai class header-right, maka kalau Anda ingin mengatur posisinya biar terlihat ditengah Anda perlu mencari baris atau selektor  header-right menyerupai dibawah ini

.header-right {
    float: right;
    padding: 0;
    overflow: hidden;
    margin: 15px 0;
    width: 72.8%;
    max-width: 728px;
}

Disini Saya spesialuntuk merubah bab marginnya saja menjadi  menyerupai ini 

.header-right {
    float: right;
    padding: 0;
    overflow: hidden;
    margin: 15px 25px 1px;
    width: 72.8%;
    max-width: 728px;
}

Silahkan Anda coba otak - atik sendiri sesuai dengan keinginan, selamat mencoba

Share :