Blogger：如何为Designer页面创建自定义变量定义

Question

当您登录Blogger.com并单击“模板”页面时，您在每个模板中看到的第一件事就是“变量定义”。这些变量定义显示在Blogger.com界面的用户友好的Designer页面上。

例如：

<Group description="Blog Title" selector=".header h1">
<Variable name="header.font" description="Title Font" type="font" default="normal bold 40px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal bold 40px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
<Variable name="header.text.color" description="Title Color" type="color" default="$(body.text.color)"  value="#000000"/>
<Variable name="header.background.color" description="Header Background" type="color" default="transparent"  value="transparent"/>
</Group>

上述变量定义可让您轻松更改博客标题的颜色和其他标题信息。

我想创建自己的自定义变量。

我理解大多数变量是如何工作的。像“name =”一样，是在类或ID CSS中使用的变量。就像名称是name =“custom.name.here”一样，它应该与您要更改的类名或ID相关联。因此：

#Header1 {
$(custom.name.here)
}

“description =”是将显示在Designer页面上的名称，因此您知道要更改的内容。

问题中唯一的部分是：“type =”变量和可以放在“type =”中的选项？还有“default =”和“value =”这些以及可以放在这些中的内容是什么？这些是否需要？

Answer 1

This blog post对变量有一个很好的解释。总之，变量的属性如下。

• name - 变量的唯一ID。不能包含空格。
• description：显示在设计器页面上的简短描述。
• type：变量的类型。允许的3种类型包括color，font和automatic
• 默认值：模板默认值。只要选择“恢复为模板默认值”选项，就会应用此值。
• value：变量的当前值。