Merubah Warna Sub Sajian Template Evo Magz

Secara default warna sub hidangan dari template Evo Magz yaitu Putih dengan text hitam dengan warna hover sedikit ke bubuk - abuan, warna sub hidangan tersebut tidak dapat kita rubah dari halaman penyesuian blogger, jadi kita perlu melaksanakan editing css untuk warna sub menunya. Sebelumnya juga Saya pernah Iseng - Iseng Modifikasi Template Evo Magz dan sudah melaksanakan banyak perubahan terutama untuk bab menunya

Berikut ini yaitu langkah - langkan Merubah Warna Sub Menu Template Evo Magz :

1. Masuk ke blogger, klik Template > Edit HTML

2. Cari aba-aba /* NAVIGATION MENU2 */, aba-aba tersebut sebenarnya

spesialuntuklah sebuah tanda yang menyatakan bahwa dibawah aba-aba tersebut

ada susunan CSS untuk warna navigasi

3. Selanjutnya scrol ke bawah dan cari susunan css ibarat diberikut

    .nav-menu2 li ul {
     background:#0072c6;
     display:block;
     position:absolute;
    left:0;
    z-index:10;
    visibility:hidden;
    opacity:0;
    -webkit-transition:all .25s ease-out;
    -moz-transition:all .25s ease-out;
    -ms-transition:all .25s ease-out;
    -o-transition:all .25s ease-out;
    transition:all .25s ease-out;
    box-shadow:0 0 4px rgba(0,0,0,0.3);

4. Kode background:#0072c6; ialah aba-aba warna background yang aku

pakai, Anda dapat memakai aba-aba warna lain. Kode warna dapat Anda

lihat di ----> LIHAT KODE WARNA

5. Bila Anda ingin merubah text dari sub hidangan tersebut, Anda dapat scroll lagi

kebawah dan cari susunan css ibarat diberikut

.nav-menu2 li li a {

     display: block;
     color:#fff;
     position: relative;
     z-index:100;
     line-height:32px;

6. color:#fff; ialah aba-aba warna text yang dapat Anda rubah sendiri

7. Selanjutnya kalau Anda ingin merubah warna hover dari sub menunya, Anda

dapat sedikit scroll lagi kebawah dan cari susunan css ibarat diberikut :

.nav-menu2 li li a:hover {
background:#2f96e3;

8. Kode background:#2f96e3; ialah aba-aba warna yang saya pakai, Anda bisa

merubahnya sesuai harapan dengan cara mengganti nilainya

memakai aba-aba warna yang lain

Ini bahu-membahu masih belum final alasannya yaitu saat layar diperkecil ternyata sub hidangan dan hovernya tidak mengikuti variabel css sebelumnya, alasannya yaitu warna css saat layar diperkecil sudah ditentukan sendiri oleh si pembuat template, maka dari itu kita masih harus merubahnya caranya yaitu sebagai diberikut :

1. Cari susunan aba-aba css ibarat diberikut

@media only screen and (max-width:768px){

2. Kemudian scroll sedikit kebawah dan cari susunan css ibarat diberikut

     .nav-menu2 li ul {
        background:#000;
        border:none;
        box-shadow:none;

3. Kode background:#000; ialah aba-aba warna yang saya gunakan

silahkan rubah sesuai selera

4. Selanjutnya kalau kita juga ingin merubah warna hovernya maka cari

susunan aba-aba CSS ibarat dibawah ini

.nav-menu2 li li a:hover {
background:#2f96e3;

5. Silahkan rubah background:#2f96e3; nilai variable/warnanya sesuai

keinginan

Saya sudah menerapkan cara diatas ke blog ini, dan kesudahannya kurang lebih ibarat diberikut :