Tổng hợp cấu trúc dữ liệu Blogger – Blogger Template Cheat Sheet

Blogger template cheat sheet

data:skin

Section này Blogger dùng để chứa dữ liệu liên quan đến <b:skin> đang sử dụng.

"data": {
  "skin": {
    "override": string,
    "vars": {object}
  }
}

data:skin.override

data:skin.override thuộc loại STRING, chứa liên kết đến tệp CSS của Theme, được khai báo trong Theme Designer.

data:skin.vars

data:skin.vars thuộc loại OBJECT, chứa các biến liên quan đến template.

Đối với các template tùy chỉnh, chúng ta có thể dễ dàng khai báo thêm các biến trong thẻ <b:skin> với cú pháp sau:

<b:skin version='1.0.0'><![CDATA[
/*
<!-- Variable definitions -->
<Variable name="keycolor" description="Main Color" type="color" default="#007AFF" value="#007AFF"/>
<Group description="Theme Options">
    <Variable name="sidebar" description="Left Sidebar" type="length" default="0px" min="0px" max="1px" value="0px"/>
    <Variable name="fixedmenu" description="Fixed Menu" type="length" default="1px" min="0px" max="1px" value="0px"/>

</Group>
<!-- Additional Variables -->
<Variable name="body.background.color" description="Comments Background" hideEditor="true" type="color" default="transparent"  value="transparent"/>

*/
</b:template-skin>

Để sử dụng biến keycolor đã khai báo trong phần CSS, hãy dùng cú pháp sau:

#post-body {color: $keycolor;}

Ngoài việc sử dụng trong CSS ra thì chúng ta cũng có thể trích xuất các biến này để sử dụng trong meta header.

<head>
<meta expr:content='data:skin.vars.keycolor' name='theme-color'/>
</head>

data:template

Phần này chứ dữ liệu liên quan đến template mặc định của Blogger.

"data": {
  "template": {
    "name": string,
    "localizedName": string,
    "variant": string,
    "variantId": string,
    "isResponsive": boolean,
    "isCustom": boolean,
    "isAlternateRendering": boolean
  }
}