Untuk memberi warna setiap section ataupun widget pada Layout Blogger/Blogspot, tidak dapat diterapkan pada jenis HTML5.
Salah satu ciri struktur HTML5 yang paling mencolok adalah, goresan pena HTML ditulis dengan aksara kapital, baik dibagian pembuka dan penutupnya. Contoh menyerupai ini:
Syarat biar dapat mewarnai tampilan Layout/Tata Letak di Blogger, Anda harus ubah goresan pena isyarat
Syarat selanjutnya ialah, kita harus menambahkan (atau mengganti) skin template, dengan yang menyerupai ini:
Nah, pada skin tersebut kita sudah dapat mewarnai section dan widget apa saja pada Layout.
Petunjuk mewarnai Layout kurang lebih dapat diterapkan menyerupai berikut ini:
Ingin mewarnai seluruh tampilan Layout/Tata Letak:
Jika ingin mewarnai section Layout/Tata Letak:
Atau
Atau
Atau
Jika ingin mewarnai setiap widget pada Layout/Tata Letak. Misalnya widget pada sidebar:
Sesuaikan tag ID atau Class ataupun selector di atas sesuai struktur template Anda.
Jika disatukan maka hasil penerapannya menjadi menyerupai ini:
Demikian tutorial perihal cara mempercantik tampilan layout/tata letak dengan memberi warna pada masing-masing section dan widget.
Semoga membantu dan selamat mencoba.
Salah satu ciri struktur HTML5 yang paling mencolok adalah, goresan pena HTML ditulis dengan aksara kapital, baik dibagian pembuka dan penutupnya. Contoh menyerupai ini:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<title>Hello world!</title>
</head>
<body>
</body>
<HTML>
Syarat biar dapat mewarnai tampilan Layout/Tata Letak di Blogger, Anda harus ubah goresan pena isyarat
<HTML> (yang aksara kapital) tersebut menjadi aksara kecil. Sehingga pembukannya nampak menyerupai ini <html> dan penutupnya menyerupai ini </html>.Syarat selanjutnya ialah, kita harus menambahkan (atau mengganti) skin template, dengan yang menyerupai ini:
<b:template-skin>
<![CDATA[
// CSS Anda disini
]]></b:template-skin>
Nah, pada skin tersebut kita sudah dapat mewarnai section dan widget apa saja pada Layout.
Petunjuk mewarnai Layout kurang lebih dapat diterapkan menyerupai berikut ini:
Ingin mewarnai seluruh tampilan Layout/Tata Letak:
body#layout{background:#2469d8!important}
Jika ingin mewarnai section Layout/Tata Letak:
body#layout #content-wrapper{background-color:#673e7d}
Atau
body#layout #header-wrapper{background-color:#f442df}
Atau
body#layout #sidebar-wrapper{background-color:#f4416e}
Atau
body#layout #footer-wrapper{background-color:#d6634d}
Jika ingin mewarnai setiap widget pada Layout/Tata Letak. Misalnya widget pada sidebar:
#layout #sidebar-wrapper .widget-content{background:##5fd64d!important;border:none!important}
Sesuaikan tag ID atau Class ataupun selector di atas sesuai struktur template Anda.
Jika disatukan maka hasil penerapannya menjadi menyerupai ini:
<b:template-skin>
<![CDATA[
body#layout{background:#2469d8!important}
body#layout #content-wrapper{background-color:#673e7d}
body#layout #header-wrapper{background-color:#f442df}
body#layout #sidebar-wrapper{background-color:#f4416e}
body#layout #footer-wrapper{background-color:#d6634d}
#layout #sidebar-wrapper .widget-content{background:##5fd64d!important;border:none!important}
]]></b:template-skin>
Demikian tutorial perihal cara mempercantik tampilan layout/tata letak dengan memberi warna pada masing-masing section dan widget.
Semoga membantu dan selamat mencoba.
Advertisement