Blogger template: Style blog post based on label

Question

Hello,

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-title <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

Answer 1

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.