La balise d'ajout de valeur dans l'attribut class [b:class]

Nous vous rappelons que lorsque vous accédez à ce blog, vous signez automatiquement un accord avec Blogger Code.
Consultez les CGU.

La balise singleton <b:class> est une balise d'instruction qui permet d'ajouter à la balise parente une valeur dans un attribut class.

La syntaxe

XML

<div>

  <b:class cond='CONDITION' name='CLASS_NAME'/>

</div>

• La balise <b:class> travaille dans l'ensemble du code XML, excepté dans la balise <b:skin>.
• Plusieurs balises <b:class> peuvent se cumuler.
• Les balises <b:class> ne peuvent pas s'imbriquer.

Les attributs

La balise doit contenir plusieurs attributs dont certains sont obligatoires.

<b:class cond='CONDITION'
         name='CLASS_NAME'/>

<b:class cond='CONDITION'
         expr:name='EXPRESSION'/>

Attributs	Classification	Préfixe "expr:"	Signification	-
name	HTML classic	autorisé	La valeur attendue est le nom de la classe qui sera ajouté à la balise parente. Accompagné du préfixe expr:, la valeur peut-être : une donnée de type string une expression Blogger dont le résultat est de type string	Obligatoire
cond	XML Blogger Expression	autorisé	Condition d'exécution de la balise. La valeur attendue doit être boolean (true ou false). Elle peut être une valeur explicite, une donnée ou une expression Blogger. En savoir plus	Facultatif

Quelques exemples

Ajouter une classe

<div>

  <b:class name='footer'/>

</div>

La nouvelle classe footer sera ajoutée à la balise parente <div> dans le rendu HTML.

Résultat

<div class='footer'>

</div>

Ajouter une classe avec une condition

<div>

  <b:class cond='data:view.isHomepage' name='footer'/>

</div>

La nouvelle classe footer sera ajoutée à la balise parente <div> dans le rendu HTML uniquement si la page courante est la page d'accueil.

Résultat si vrai

<div class='footer'>

</div>

Résultat si faux

<div>

</div>

Ajouter une classe à une classe existante

<div class='section'>

  <b:class name='footer'/>

</div>

La nouvelle classe footer sera ajoutée à la balise parente <div> dans le rendu HTML. Les classes existantes dans la balise parente sont conservées.

Résultat

<div class='section footer'>

</div>

Note: Pour écraser une classe existante, utilisez la balise d'attribut.

Écraser la classe existante

<div class='footer'>

  <b:attr name='class' value='header'/>

</div>

Cumuler plusieurs classes

<div class='section'>

  <b:class name='footer'/>
  <b:class name='left'/>

</div>

Les nouvelles classes footer et left seront ajoutées à la balise parente <div> dans le rendu HTML. Les classes existantes dans la balise parente sont conservées.

Résultat

<div class='section footer left'>

</div>

Ajouter une classe variable

<div>

  <b:class expr:name='data:view.isHomepage ? "superfooter" : "footer"'/>

</div>

L'attribut name a été converti en une expression Blogger pouvant contenir une donnée ou une opération. Dans cet exemple, l'expression est un opérateur ternaire. Le nom de la nouvelle classe sera superfooter si la page courante est la page d'accueil. Dans le cas contraire, le nom de nouvelle classe sera footer.

Résultat si page d'accueil

<div class='superfooter'>

</div>

Résultat si autre page

<div class='footer'>

</div>

Les autres balises

• <b:attr>
• <b:case>
• <b:class>
• <b:comment>
• <b:default>
• <b:defaultmarkup>
• <b:defaultmarkups>
• <b:else>
• <b:elseif>
• <b:eval>
• <b:if>
• <b:includable>
• <b:include>
• <b:loop>
• <b:message>
• <b:param>
• <b:section>
• <b:skin>
• <b:switch>
• <b:tag>
• <b:template-script>
• <b:template-skin>
• <b:widget>
• <b:widget-setting>
• <b:widget-settings>
• <b:with>
• <data:foo>
• <![CDATA[]]>

Retourner à l'introduction