Customizing each post page based on a tag in Blogger

I came across a Post post setup that showed how to create each blog post based on a shortcut that was posted. That is, every post with the same tag will automatically have the same design.

But the problem is that I cannot customize the external content (main wrapper) because the "label" is only defined as the content area of ​​the message. I like the different colors of the header and other outer skin for my labels.

I will give the code that I used

replace the second occurrence <data:post.body/>

(between the span attribute) with this

<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
<!-- Only using the last label -->
<div expr:class='"label" +'>
<p> <data:post.body/> </p>
<div class='labelNone'> <p><data:post.body/></p> </div>


Then, in the styling part of your template, apply the style by specifying the div class. Here's an example that will place a background image for all posts tagged "tech":

<style type='text/css'>
div.labeltech {
background-image: url(&quot;;);
background-repeat: no-repeat;
background-position: bottom right;
display: block; 


It would be very nice if the knowledgeable members on stack overflow could help me, since I'm just a student.


source to share

1 answer

I'm afraid you will have to stick with the javascript (like jquery) implementation of 'parent', i.e.

When it comes to the CSS spec, the parent selector does not exist in either CSS2 or the CSS3 spec. You can play around with the "select X element parent of Y" (Y> X), but that's it for now.

Please see the list of available selectors and you may find something useful

On the bright side, there are plans to create something like this

!div p{}


but so far it is still a draft and no browser supports it



All Articles