Monday, October 02, 2006

The Anatomy of a Beta Blogger Widget..

The code which makes a widget/Page Element in beta Blogger is as follows :

<div id="'sidebar-wrapper'">
<b:section class="'sidebar'" id="'sidebar'" preferred="'yes'">
<b:widget id="'HTML2'" locked="'false'" title="''" type="'HTML'/">
</b:widget>
</b:section>
</div>

The third line from top represents the widget 'HTML2' in unexpanded form.

The property locked="false" means it can be moved to other sections of the page like header or footer in Page Layout view. At present it resides in the sidebar section. The sidebar section resides in the 'sidebar-wrapper' div.

When we check the box 'Expand widget templates' in Edit Html field we can see the full code for this widget which is as follows :

<b:widget id='HTML2' locked='true' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

No comments: