Membuat Custom Varible Definitions Semoga Template Blog Gampang Disesuaikan

Assalamu'alaikum wr wb, pada postingan kali ini kita akan mempelajari wacana CSS Variable Definitions yang berada pada template blogger. Variable definitions ini dapat kita temukan pada arahan xml template, biasanya berada di antara arahan <b:skin><![CDATA[ ... ]]></b:skin>. misalnya ibarat arahan di bawah ini.

/* Variable definitions    ====================    <Variable name="bgcolor" description="Warna Latar Belakang"              type="color" default="#fff" value="#ffffff">     ...    <Variable name="pagetitlefont" description="Blog Title Font"              type="font"              default="normal normal 200% Georgia, Serif" value="normal normal 200% Coming Soon"> */

Nah, fungsinya sendiri yaitu untuk mengatur pengaturan template (misal untuk mengubah warna font, ukuran font, jenis font, dll) pribadi pada pengaturan template di blogger tanpa harus mengubah arahan xml templatenya.

Membuat Custom Variable Definitions

pada postingan kali ini kita akan mempelajari wacana CSS Variable Definitions yang berad Membuat Custom Varible Definitions biar Template Blog cepatdangampang Disesuaikan

Di sini kita akan membuat 2 jenis variable definitions, yaitu untuk pengaturan warna dan pengaturan font.

Letakkan variable definitions di antara kode

/* Variable definitions    ==================== .... */

Variable Pengaturan Warna

Misalnya kita buat variable warna untuk mengatur latar belakang templatenya, kita dapat menuliskan kodenya ibarat ini

   <Variable name="bgcolor" description="Warna Latar Belakang"              type="color" default="#ffffff" value="#ffffff">

Penjelasannya:

name="..." ialah nama variablenya
description="..." ialah deskripsi variablenya yang nanti akan muncul di pengaturan template.
type="..." ialah tipe variablenya, color untuk warna, dan font untuk pengaturan font.
default="..." ialah niai defaultnya.
value="..." ialah nilai warna yang dipilih.

Sesuai contoh, alasannya kita akan membuat variable untuk mengatur warna latar belakang, maka kita dapat menerapkannya ibarat ini.

body {   background:$bgcolor; }

Dimana bgcolor ialah nama variable yang kita buat, jadi untuk penerapannya kita bubuhkan simbol $ kemudian tuliskan nama variablenya.

Variable Pengaturan Font

misal kita akan membuat pengaturan font pada headernya, kita dapat menuliskannya ibarat ini

   <Variable name="headerfont" description="Header Font"              type="font"              default="normal normal 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal normal 78% Arimo">

kemudian pada untuk menerapkannya, kita dapat menerapkannya ibarat ini

h2 {   font:$headerfont; }

melaluiataubersamaini ini kita tidak perlu mengedit arahan xmlnya, kita spesialuntuk perlu ke bab Template > Sesuaikan.

Ini ialah hasil yang tadi di buat

Sekian dari saya pada postingan kali ini, terimakasih sudah mengunjungi blog aku, dan semoga bermanfaa.

Silakan untuk berkomentar.

Wassalamu'alaikum wr wb.