Widget Tags for Layouts

原文

用<b:widget>标签创建widgets的方法已经在Page Element Tags for Layouts 里描述过。如果平时你只用Page Elements进行操作，那么之前描述的内容已经足够。但是如果你想要更进一步的控制各个页面元素，这篇文章将会说明打开edit html页面的Expand Widget Templates之后，你可以在widget里整些什么东西。

最开始要做的是给widget添加一个关门标签，像这样的代码

<b:widget [...attributes...] />

要变成这样

<b:widget [...attributes...]>
</b:widget>

现在准备工作结束，下面我们来谈谈可以在其中添加的东西。

Includes

widget内容要包含在includable标签里，它的格式如下

<b:includable id='main' var='thiswidget'>
    [insert whatever content you want here]
</b:includable>

相关的属性如下：
id：（必须）由字母或数字组成的不重复的标识符
var：（可选）由字母和数字组成的标识符，用于关联同一个section的data。 (data部分在下面)

Each widget must have one includable with id='main'. This will usually contain most or all of the content that will display for this widget, and in many cases it will be all you need.

如果你建立了新的includable id，他们不会自动显示。比如创建一个id='new'的标签之后，只有添加这个代码<b:include name='new' />才会正确显示。

b:include的属性如下
name：（必须）由数字或者字母组成的标识符。必须和相关widget在b:includable中的id相对应。
data：（可选）给includable section赋一些data值，将作为var的属性。

下面是关于b:includable和b:include用法一个简单的例子。里面的loops和data语句稍后会在文章里说到。主要需要理解的是 post部分怎样包含在main部分里.这段代码将找出叫做i的post，设置var属性为p，然后输出标题。

<b:includable id='main'>
   <b:loop var='i' values='posts'>
      <b:include name='post' data='i'/>
   </b:loop>
</b:includable>

<b:includable id='post' var='p'>
   Title: <data:p.title/>
</b:includable>

在你需要把一段code同时放到不同位置的时候，Includes就非常的有用。只要把这段code放进b:includable标签里，然后在需要要显示的地方使用b:include标签即可。如果你不需要这样随处乱放，那么就弄一个id为main的includable就不用管其他事情了。 (注意id为main的include会自动完成，<b:include name='main'/>不是必须的）


data:

这个标签在最重要的几个标签里属于arguably one，他是blog相关数据通往显示页面的门径。关于这个标签的一些例子:

<data:title/>
<data:photo.url/>

第一个应该是最简单的，在大部分的widget 中都能应用，因为widget基本都有一个title。它的功能就是输出widget的title。第二个是稍微复杂一点的变量，属于一种二级标签，比如一个profile widget的内容里有一个photo标签，它可能有url、height和width这些二级标签，用"."添加前缀可以确定我们需要的是photo的 url而不是其他一些什么东西的url。

通过data：标签还可以做一大堆事情，他的变量范围根据所在的widget而有些不同，这是一个比较全的列表 ，你可以找到所需要的data。


Loops

b:loop标签可以让你重复显示一系列内容。最常用到的地方是在显示一堆post的页面输出其中的post，或者一堆评论或者一堆label诸如此类。 loops的通常格式是这样的:

<b:loop var='identifier' values='set-of-data'>
   [repeated content goes here]
</b:loop>

identifier部分你可以任意命名,列表上的新item都会用到这个,通常可以简单的命名为"i",value部分你可以使用任何一个描述过的 data:标签.以post widget作为例子,帖子是一个list.下面的code将会loop输出每个post的title,并有<h2>标签:

<b:loop var='i' values='data:posts'>
   <h2><data:i.title/></h2>
</b:loop>

注意i是怎样给每个post赋值的,让你可以分别得到post的标题.


注:loop这个标签看的不是很明白，目前理解的结果是var的标示符随意，它的唯一作用就是在loop标签之间作为一个标识从而输出系列的数据，上面这个例子里生成页面时就是重复这样的结构data:posts.title。至于具体是怎样找出post id之类还是去问google吧。

另外feed wdget 的data说明里也有一部分相关内容。


If / Else

你可以用b:if和 b:else标签控制内容只在某些地方显示.通常的格式:

<b:if cond='condition'>
   [content to display if condition is true]
<b:else/>
   [content to display if condition is false]
</b:if>

b:else标签可选,没有它的情况下,会显示b:if 之间的内容(true)或者什么都不显示(false).关门标签</b:if>则是必须的.

condition部分你可以设置所有结果为true或者false的条件.有些data本身标签值就很明显,比如allowComments之类.其他部分可能需要自己判断到底是true还是false.下面是例子

    * <b:if cond='data:post.showBacklinks'> 设置成显示backlink的时候值为true
    * <b:if cond='data:blog.pageType == "item"'> 当前页面时item page的时候值为true
    * <b:if cond='data:displayname != "Fred"'> 作者的display name不是fred的时候值为true
    * <b:if cond='data:post.numComments > 1'> 有一个以上评论的时候值为true.