Showing Only Post Titles on Label Pages

Some blog template that currently exist on the page click on the label that appears is the entire contents of the blog, the content of their blogs or some of the content on that page. Well, in this tutorial, I want to discuss how to make the display labels on the blog page that appears only the title of our blog posts only (As the picture).

1. Login to Blogger
2. Go to the Lay Out, then to the Edit HTML
    Back up your Template by clicking: Download Full Template
    After that, check the Expand Widget Templates.

So for this tutorial is divided into 2 different versions:
1. Display Label Without Box
Look at the preview image, the image is a view that uses the box, then what purpose Without Box Display Label? Without the box that appears here means only writing course (post title only).
Immediately, we begin the tutorial:

     <! - Posts ->
     <div class='blog-posts hfeed'>

     <b:include data='top' name='status-message'/>

     <data:adStart/>
     <b:loop values='data:posts' var='post'>
     <b:if cond='data:post.dateHeader'>

     <h2 class='date-header'> <data:post.dateHeader/> </ h2>
     </ b: if>

     <b:include data='post' name='post'/>

Note: Look for the red code, use Ctrl + F
  
- After the meet, Replace the red code with the code below:

     <b: if cond = 'data: blog.homepageUrl! =
     data: blog.url '>
     <b:if cond='data:blog.pageType != "item"'>
     <a expr:href='data:post.url'>
     <data:post.title/> </ a> <br/> <br/>
     <b:else/>

     <b:include data='post' name='post'/>
     </ b: if>
     <b:else/>
     <b:include data='post' name='post'/>
     </ b: if>

  - Then Save Template.


2. Using Label Display Box
Well, for this tutorial begins after installation tutorial "Display Labels Without a Box" in the save / finish.
Ok more ...

     <b: if cond = 'data: blog.homepageUrl! =
     data: blog.url '>
     <b:if cond='data:blog.pageType != "item"'>
     <a expr:href='data:post.url'>

     <data:post.title/> </ a> <br/> <br/>

     <b:else/>
     <b:include data='post' name='post'/>
     </ b: if>
     <b:else/>
     <b:include data='post' name='post'/>
     </ b: if>

Note: Look for the red code, use Ctrl + F
          (Remember! HTML code above will be visible in your blog after you do the tutorial "Display Label Without Box)
 

After the meet, Replace the red code with the code below:

     <div style='padding:6px 0 6px solid 5px;border-right:1px solid #ccc;border-bottom:1px #ccc;margin-bottom:2px;background:#ffffff;color:#000000;'>
     <img alt = 'Arrow | Khamardos Blog' border = '0 'width = '12' height = '12 'src =' http://i655.photobucket.com/albums/uu271/spantibelspku/Panah_2_thumb.png '/ >
     <data:post.title/> </ div> </ a>

  Note: (Green) : Replace with the appropriate color on the blog (Use the HTML Color Code)
            (Orange) : Replace the image URL arrows buddy icon

- Then Save Template ...

Been successful? Interesting is not it? Many of the benefits we are using this tutorial, usually pages filled with postings label was heavy then after using this tutorial is expected to display and access to buddy label pages will be felt quickly.

Related Post:

Comments