Show Post Title Only on Homepage for Blogger

One of the things I liked figuring out when it comes to blog design is make everything easy for my visitors to navigate and browse my blogs. So now I will share a simple yet cool trick for blogger, its about showing post title only on homepage for the blogger blogging platform.

This trick is really cool if you blog about more about writing and you use less image for your blog. I implemented this trick on this blog because I want to focus more on writing and not looking and creating images that will fit with my blog post.

So lets start this trick shall we

Show post title only on homepage

1. Go to your blogger.com account > select a blog > go to layout > edit HTML

2. Use control+F and look for the </head> tag.

3. After looking for the above tag, kindly paste the codes below just above it.

<style type='text/css'>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>

.post {
margin:.5em 0 1.5em;
border-bottom:0px dotted $bordercolor;
padding-bottom:1.0em;
height:50px;
}
.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:20px;
font-family:Tahoma,Georgia,Century gothic,Arial,sans-serif;
font-weight:normal;
line-height:1.4em;
color:#cc6600;
}

.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:#000000;
font-weight:normal;
}

.post h3 strong, .post h3 a:hover {color:#333333;}

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

4. Save your template

5. If you like to add more blog post on your homepage, just go to > layout > blog post section and enter the number value on the "number of post on main page" of your choice then save.

Customize

• *If you want to change the default font color just change the value of  000000. You can also change the color of the hover effect by replacing 333333. If you have trouble with hex colors check out my blog tools.

You are all done! with this trick you can show a lot of posts on the main page which will help expose more of your articles.

Do you liked it?

Let me know by sharing it to others.

Facebook Blogger Plugin: Bloggerized by Bloggerpreneur Enhanced by fromhobby2money.blogspot.com