How To Change Post Title Color in Picture Window Template

By default, there is no option to change post title color in Blogger Designer Templates. I've already written a tutorial to do that but users of Picture Window template are having problems. Here is a tutorial to change post title color in Picture Window template.

Note: If you're using other templates then see this tutorial:
Blogspot How To: Change Post Title Color in Blogger Template Designer Templates

Steps to Change Post Title Color in Picture Window Template

1. Go to 'Design' then 'Edit HTML' tab.


2. Find the following code:
   

      <Group description="Post Title" selector="h3.post-title, .comments h4">
   
        <Variable name="post.title.font" description="Title Font" type="font"
   
            default="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
   
      </Group>

   You can press 'Ctrl + f' keys or simply scroll down the HTML a bit to find the code.


3. Replace the previous code with the following code:
   

      <Group description="Post Title" selector="h3.post-title, .comments h4">
   
        <Variable name="post.title.font" description="Title Font" type="font"
   
            default="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
   
        <Variable name="post.title.color" description="Color" type="color" default="#FE6602" value="#FE6602"/>
   
   <Variable name="post.title.hover.color" description="Hover Color" type="color" default="#FFD25F" value="#FFD25F"/>
   
      </Group>



4. Now find this code:
   

   h3.post-title {
   
     margin: 0;
   
     font: $(post.title.font);
   
   }



5. Replace the above code with this code:
   

   h3.post-title {
   
     margin: 0;
   
     font: $(post.title.font);
   
     color: $(post.title.color);
   
   }
   
   
   
   h3.post-title a {
   
     color: $(post.title.color);
   
   }
   
   
   
   h3.post-title a:hover {
   
     color: $(post.title.hover.color);
   
   }



6. Save your template.


7. Now go to 'Template Designer' then 'Advanced' and edit the 'Post Title' option.
   
   
   


8. You can simply edit the post color and post hover color from here.


9. Enjoy!

Update: How to Change Post Title Color on Post Page?

A reader has asked how to change the post title color on post pages so here is a tutorial for that as well.

Description: How To Change Post Title Color in Picture Window Template Rating: 4.5 Reviewer: Unknown - ItemReviewed: How To Change Post Title Color in Picture Window Template Hot News!!! "Sepeda Motor Injeksi Irit Harga Terbaik Cuma Honda"