Jadikan Header Simple Template Transparent

Assalamualaikum ,


Harini Afiq mau ajar cara transparentkan header tanpa menggunakan photoshop , GIMP dan sebagainya . Tanpa membuang masa , tengok la pict bawah ni .


Sebelum :

Selepas :

Nampakkan perubahan ? kalau korang nak tuto ni  , ikut step-step bawah k 

NOTE : Kalau background korang putih , baik takyah buat la k .

1. Dashboard > Design > Edit HTML 

2. CTRL +F dan cari code bawah ni 

 /* Mobile

3. Korang copy code bawah ni dan pastekan di atas code  /* Mobile tadi .

 .header-outer, .content-inner { background-color: transparent; }.main-outer, .tabs-outer { background-color: $(content.background.color);}

4. Preview dulu okayyy ! kalau takda papa baru save . *preview dulu

5. Hmmmmm , belum habis lagi k . Kalau korang preview takda keluar benda pelik-pelik korang ikut tuto seterusnya .

6. Kemudian , cari code bawah ni k .

 .content-outer { 

7. Pastu dekat bawah dia ada code macam ni kan ?

 .content-outer {  -moz-box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);  -webkit-box-shadow: 0 0 $(content.shadow.spread.webkit) rgba(0, 0, 0, .15);  -goog-ms-box-shadow: 0 0 $(content.shadow.spread.ie) #333333;  box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);

8. Korang buang code atas ni okayyy . nanty akan jadi macam bawah ni .

9. Preview dulu k . Pastu baru save template .

NOTE : Selamat mencuba dan kalau tak jadi komen k . *SEBELUM TU DOWNLOAD TEMPLATE DULU K .


Credit to : adley :)

---

Thank you for reading :*

---