九月 07, 2006

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.
发表评论