Box Header Kotak Melengkung di Mobile HP

Tutorial merubah Box Header menjadi melengkung di Mobile HP pada Template Plus UI

Box Header Kotak Melengkung di Mobile HP

Box Header

Box Header adalah tampilan box atau kotak terletak di bagian atas blog. Box header berisi tentang judul blog, deskripsi blog, logo dan menu blog.

Tutorial

Bagaimana merubah tampilan kotak header melengkung ? Cara merubah tampilan Menu scroll Tema Plus UI 2.6, supaya menjadi menarik, ikuti langkah-langkahnya sebagai berikut.

Kode Script Box Header

1. Pertama masuk ke Dashboard Blogger.
2. Pilih Tema.
3. Pilih Edit HTML.
4. Langkah #1 - Cari kode script yang mirip di bawah ini .

@media screen and (max-width:640px){
/* Header */ .headCn{height:var(--headerHm)}

5. Langkah #2 - Setelah ketemu, ganti dengan kode script di bawah ini.

@media screen and (max-width:640px){/* Header */ header{border-bottom:none} .headCn{border-radius: 0 0 18px 18px;height:47px;border-bottom: 2px solid #eee;box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3)}

6. Terakhir - Pratinjau dan Simpan .

NB: Semakin besar angka dari 18px 18px , semakin besar lengkungan nya.

Demikian Cara membuat Box Header Kotak Melengkung di Mobile HP pada Template Plus UI 2.6, semoga bermanfaat.

Go to Link