How to Change post title color blogger

Blogger provides the Template specific post title colors but if you want to customize in your own way then you can. You are here because there is no option to change post title color on blogger template designer as below image. Do you want the same option as in my Template designer, follow my guide from scratch.

Blogger-post-title-color

To enable option to change the post color, go to the Blogger Dashboard and Backup the Blogger template first before doing any changes to the Template.

After Backing up the Template inside dashboard click on Template > Edit HTML. Click inside that and find <b:skin>…</b:skin>. Expand it and scroll little, you’ll find the below lines.

/* Variable definitions
   ============

Below that add the  following code to add snippet for the Template designer.
<Group description=”Post Title Color” selector=”h3.post-title”>
     <Variable name=”post.title.link.color” description=”Link Color” type=”color” default=”#ff0000″ value=”#ff0000″/>
     <Variable name=”post.title.hover.color” description=”Link Hover Color” type=”color” default=”#0000ff” value=”#00ffff”/>
     <Variable name=”post.title.color” description=”Color on Post Page” type=”color” default=”#ff00ff” value=”#ff00ff”/>
</Group>
Now scroll bellow and find the code ]]></b:skin>.
Above that add the following code

h3.post-title { color:$(post.title.color); }
h3.post-title a, h3.post-title a:visited { color:$(post.title.link.color); }
h3.post-title a:hover { color:$(post.title.hover.color); }

Now you’re done and save template. Here you’ll See the Red color of post title and on hover you’ll see another color. But don’t worry, move to the Template > customize. Now inside the Blogger Template designer Advanced > Post Title Color, you’ll find the option to change the post title color as in above image. Select the color of your choice for post title and hover change.

Thanks and raise your queries below by comment.

Leave a Comment