Cara Mewarnai Layout atau Tata Letak Blogger

Untuk memberi warna setiap section ataupun widget pada Layout Blogger/Blogspot, tidak bisa diterapkan pada jenis HTML5.
Cara memberi warna setiap widget pada layout Blogger/Blogspot

Salah satu ciri struktur HTML5 yang paling mencolok adalah, tulisan HTML ditulis dengan huruf kapital, baik dibagian pembuka dan penutupnya. Contoh seperti ini:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<title>Hello world!</title>
</head>
<body>
</body>
<HTML>

Syarat agar bisa mewarnai tampilan Layout/Tata Letak di Blogger, Anda harus ubah tulisan kode <HTML> (yang huruf kapital) tersebut menjadi huruf kecil. Sehingga pembukannya nampak seperti ini <html> dan penutupnya seperti ini </html>.

Syarat selanjutnya ialah, kita harus menambahkan (atau mengganti) skin template, dengan yang seperti ini:
<b:template-skin>
<![CDATA[
// CSS Anda disini
]]></b:template-skin>

Nah, pada skin tersebut kita sudah bisa mewarnai section dan widget apa saja pada Layout.

Petunjuk mewarnai Layout kurang lebih bisa diterapkan seperti 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 seperti 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 tentang cara mempercantik tampilan layout/tata letak dengan memberi warna pada masing-masing section dan widget.

Semoga membantu dan selamat mencoba.
Niagahoster
VPS Starts from
$2.5
/Month

Vultr

Read Review
  • One-click installation of 20+ apps
  • Available 17 worldwide locations
  • 100% local SSD and high performance Intel CPUs
  • Infinite OS combinations
Visit Site
Gunakan link di atas untuk saldo akun $100 gratis
DigitalOcean
VPS Starts from
$5
/Month

DigitalOcean

Read Review
  • Deploy custom image, RDP, 1-Click App, or standard distribution
  • Flexibility and scalability
  • Fantastic average uptime of 99.99%
  • Infinite OS combinations (Linux and Windows)
  • Developer-friendly tools and APIs
Visit Site
Topup $25 to gets $100 in credit over 60 days with refer link above
Niagahoster
Mulai dari
Rp10K
/Bulan

Niagahoster

View Details
  • Free SSL Certificate
  • Garansi 30 hari
  • Free domain & website migration
  • Tersedia unlimited disk space (shared hosting, kecuali paket bayi)
Visit Site
Diskon unlimited hosting hingga 75%
Niagahoster
VPS mulai dari
Rp68
/Jam

IDCloudHost

View Details
  • One-Click Deploy
  • Lokasi server Indonesia termurah
  • Instal berbagai Control Panel, VM, OS dan aplikasi
  • Menghubungkan dengan API
Visit Site
Dapatkan free credit Rp50K dengan minimal topup Rp50K

Komentar telah ditutup dan disembunyikan. Jika ada yang perlu disampaikan silahkan kirim pesan lewat laman kontak.