Kustomisasi tag CSS untuk tata letak

Untuk menggunakan perancang template dengan CSS dari template blog Anda, ada beberapa panduan untuk diikuti.

Siapkan variabel

Di <head>bagian kode Anda, Anda harus memiliki sepasang <b:skin> </b:skin>tag.

Deklarasi gaya CSS akan masuk di antara tag tersebut, bersama dengan nama variabel yang membuat desain Anda berfungsi dengan halaman Font dan Warna.

Contoh

<head>

...
<b:skin>
 <style type='text/css'>
 /*
  * Variable definitions:
  *  <Variable name='bgcolor' description='Page Background Color'
      type='color' default='#fff'/>
  */
 body {
   background: $bgcolor;
   margin: 0;
   padding: 40px 20px;
 }
 </style>
</b:skin>
</head>

Kode CSS yang terlampir pada / * dan * / tag komentar tidak akan ditampilkan di blog Anda.

Akan ada daftar variabel di sini, satu untuk setiap font atau warna yang Anda ingin dapat diedit dari tab "Font dan Warna". Setiap variabel harus memiliki informasi yang ditunjukkan pada contoh di atas dan dijelaskan di sini:

nama - Dapat berisi huruf atau angka. Setiap nama dalam templat Anda harus unik.
description - Tambahkan deskripsi untuk tampil di bagian "Fonts and Colors".
ketik - "Font" atau "warna."
default - Nilai default. Untuk warna, ini harus berupa kode warna heksadesimal, misalnya # FF0066. Untuk font, ini akan menjadi daftar bentuk font-style font-weight font-size font-family.

Gunakan variabel

Setelah variabel diatur, saat Anda ingin menggunakan nilai variabel, masukkan $variable_namedalam b:skincss.

Jenis variabel

Perancang template memiliki dukungan pengeditan untuk serangkaian tipe variabel CSS tertentu. Untuk mengatur jenis variabel:

variabel warna akan memberikan palet warna untuk seleksi dalam perancang template.
variabel font akan menyediakan pemilihan font, dengan pilihan ukuran dan huruf tebal atau miring, pada perancang template.

Pada contoh di atas, ada variabel yang dipanggil bgcolor, yang diatur ke putih (#fff). Dalam kode berikutnya, ia mengatakan: background: $bgcolor.Ini mengubah latar belakang putih, dan Anda dapat mengubahnya di bagian "Font dan Warna".

Catatan : Anda tidak perlu membuat variabel untuk tipe atribut CSS lainnya. Ini dapat dimasukkan dalam CSS seperti biasanya (seperti halnya dengan margin:dan padding:atribut pada contoh di atas).

Pelajari lebih lanjut tentang CSS .