b:attr Tag - Blogger Tags References

Attribute tag ( <b:attr> ) allows you to generate attributes in the parent tag. The singleton tag <b:attr> is an instruction tag that allows any attribute and value to be added to the parent tag.

Syntax:

<b:attr cond='CONDITION' name='ATTRIBUTE_NAME' value='VALUE'/>

Characteristics:

• The tag <b:attr> works in all of the XML, except in the tag <b:skin>.
• Several tags <b:attr> can be combined.
• Tag <b:attr> cannot nest.

Attribute	Classify	Prefix 'expr:'	Description	Strictness
name	HTML classic	authorized	The expected value is the name of the attribute that will be added to the parent tag. Accompanied by the prefix expr:, the value may be: type data string a Blogger expression whose result is of type string	Mandatory
value	HTML classic	authorized	The expected value is the value of the attribute that will be added to the parent tag. When the value does not exist, the attribute is not added. Accompanied by the prefix expr:, the value may be: type data string a Blogger expression whose result is of type string	Mandatory
cond	XML Blogger Expression	authorized	Condition of execution of the tag. The expected value must be boolean( true or false). It can be an explicit value, a data item or a Blogger expression.	Optional

Examples:

To Add id to parent Element:

<div>

  <b:attr id='NEW_ID'/>

</div>

HTML Render:

<div id='NEW_ID'>

</div>

Add Attribute with the condition:

<div>

  <b:attr cond='data:view.isHomepage' name='style' value='background: red'/>

</div>

The new attribute style whose value is background:red, will be added to the parent tag <div> in the HTML rendering only if the current page is the home page.

If it is Hoe Page.

HTML Render:

<div style='background: red'>

</div>

If it is not a home page.

<div>

</div>

Adding an attribute whose value is an expression:

<a>
    <b:attr name='href' expr:value='data:blog.homepageUrl path "/search/" params { label: "seo" }'/>
        Anchor
</a>

HTML Render:

<a href='https://BLOG_NAME.blogspot.com/search?label=seo'>
    Anchor
</a>

To Add Multiple Attributes:

<a>
    <b:attr name='href' expr:value='data:view.url'/>
    <b:attr name='target' value='_blank'/>
    <b:attr name='title' expr:value='data:view.title'/>
Anchor
</a>

HTML Render:

<a href='https://BLOG_NAME.blogspot.com/' target='_blank' title='PAGE_TITLE'>
    Anchor
</a>

Additional Remarks:

When the tag <b:attr> is integrated into a singleton tag as <img>, <input>, <link>, <meta> etc., the editor will highlight the closing tag in red . To avoid the error, replace the singleton tag with a tag <b:tag>. For Example like this.

<b:tag name='img' expr:src='data:view.featuredImage'>

  <b:attr name='alt' value='My image'/>

</b:tag>

CAUTION BETA FUNCTIONALITY !!!
To close an open singleton tag, add a new tag inside <b:attr> with the name b:whitespace and the value "remove".

<b:tag name='img' expr:src='data:view.featuredImage'>

  <b:attr name='b:whitespace' value='remove'/>
  <b:attr name='alt' value='My image'/>

</b:tag>

Conclusion:

That's all about b:attr tag in blogger tags references.