How To Display Post Title Only On Blogger Home Page & Label Pages

This is the first article in the Category "Style Blogger". In Blogger we see the full post on the Home Page, Widget Pages & all other pages as Default settings of Blogger. This type of look is quite Odd & makes the blog length very long if we display 4 to 5 posts per page only. Look wise it is also odd & users usually don't prefer to read the blogs having very long post summary or we can say full post summary for every post on Home Page & all other pages. Previously Added Blog ---   How to Add a Simple Contact Form in Blogger. Now the Steps for Displaying Only post title in the blogger Home Page & All Other pages.

Steps for Displaying Post Title Only On Blogger Home Page & Widget Pages:

Step - 1. Log in into your Blogger account. & Select the blog to which you want to apply the changes.

Step - 2. Now Click on the "More Options" Tab & Under this click on the "Template" tab.

Step - 3. Now Click On the "Edit HTML" Tab as shown below.

Step - 4. Now find </head> using Ctrl+F5 & Put the following code above / before </head>.

Code :

<style type='text/css'>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>

<b:if cond='data:blog.pageType != &quot;item&quot;'>

.post {

margin:.5em 0 0;

border-bottom:0px dotted $bordercolor;

height:auto;

}

.post h3 {

margin:0 0;

text-align:justify;

font-size:18px;

font-weight:bold;

line-height:1.4em;

color:#0053F9;

}

.post h3 a, .post h3 a:visited, .post h3 strong {

display:block;

text-decoration:none;

color:darkblue;

font-weight:bold;

}

.post h3 strong, .post h3 a:hover {color:#333333; text-decoration:underline;}

.post-body {display:none;}

.post-footer {display:none;}

.comment-link {display:none;}

.post img {display:none;}

.post blockquote {display:none;}

.post blockquote p {display:none;}

h2.date-header {display:none;}

.post-labels {display:none;}

.post-rating {display:none;}

</b:if>

</b:if>

</style>

Now Save your template & Open your blog. You will have a new look as shown below

Now you can customize your post title by changing font-size:18px; & Color By color:darkblue;  & Font Weight By font-weight:bold; .

Friends Keep learning & sharing. If you have any problem please leave a comment. Visit Wide Info blog for latest blogs.