Blogger template: Style blog post based on label

I'm trying to change the style of a blog post (for instance change the title color), based on the labels associated to the post.

I'm a bit new to the templating, so I though I would be going to add a class with the label in the title <h3> element, and then add my CSS rules.

So I found this which would generate a proper list of labels separated by a space:

<b:loop values='data:post.labels' var='label'><data:label.name/> </b:loop>

However, it seems the validator does not let me add this inside the class attribute as follow:

<h3 class='post-title entry-t开发者_运维百科itle <b:loop values="data:post.labels" var="label"><data:label.name/> </b:loop>'>

From there, I found half the solution. Apparently, I should use expr:class instead of class as follow:

<h3 expr:class='&quot;post-title entry-title &quot; + data:list_of_labels'>

So now:

- How can I build this variable data:list_of_labels? (basically how to set a variable)

- Is there a full description of the template syntax somewhere?

- Is there another way to go around this?

Thanks, JB

This should do it. Using XML entities allows you bypass the XML validation and move the Blogger functions to where you need them. Longer explanation here: http://www.karlhorky.com/2012/06/add-blogger-labels-to-post-as-css.html

&lt;div class=&quot;post<b:if cond="data:post.labels"><b:loop values="data:post.labels" var="label"> <data:label.name></data:label.name></b:loop></b:if>&quot;&gt;
  <data:post.body>
&lt;/div&gt;

There is no way to set variables in the blogger data xml, however you can set variables using javascript.

There are many pages on the blogger data xml. Google is your friend. For example this one.

You are on the right track: do a loop, use javascript to check for the combinations you want, change the style properties or load a css file dynamically.