Displaying only post titles on archive and label pages

Preveiw of showing post tile in label and archieve page only

In how many day do you update you post.Probably you may have create hundreds of post.In a Label page how many post are shown.Are you fear of that what your visitor might thinks.The same problem goes to my Blog.In many label page the content was so more that it took nearly 3 minutes to load all the parts.But I found a solution as I Do.You may also the victim of this problem.I find a solution by replacing the post content by showing title only in Archive or Label Page.If you want as I DO follow the steps.

Showing post Titles in label or archive page.

The process is very simple if you follow each and every steps.

  1. Go to Blogger.com(You will be On Blogger Dashboard)
  2. Click on Design (for new click on drop menu and click on Template)
  3. Click on Edit Html
  4. Tick on “Expand Widget’
  5. Find the below codes(For searching press CTRL+F and add the code in search box which is to founded)'
    <b:include data='post' name='post'/>
  6. Replace the code with
    <!--Label and archive page title only hack-->
    <b:if cond='data:blog.searchLabel'>
    <h3 class='bstitle-only'><a expr:href='data:post.url'><data:post.title/></a></h3> 
    <b:else/> 
    <b:if cond='data:blog.pageType == "archive"'> 
    <h3 class='bstitle-only'><a expr:href='data:post.url'><data:post.title/></a></h3> 
    
    <b:else/> 
    <b:include data='post' name='post'/> 
    </b:if> 
    </b:if>
    <!--BloggerSinker.blogspot.com—> 

Tweaking the code.

The code of Step 6 can be tweaked easily.The Simple Tweaks are;

  1. Add lines below each post titles
    • By Inserting style by attributing after <h3 in lines 3 and 6, Like this:
      <h3 style="margin-bottom: 15px;" class='bstitle-only'><a expr:href='data:post.url'><data:post.title/></a></h3> 
  2. Styling own Code
    • Style the code by adding just before  ]]></b:skin> The following code.
    • .bstitle-only { 
      /* Add Your Styling Codes Here */ 
      }
  3. If you want to remove date heading do this(Insert between line 3 and 4)
    <style>.date-header{display:none;}</style>
  4. If you want to make title in center add this in line 9 of code
    .bstitle-only {text-align:center;}
  5. Cheers

Subscribe At free
Thank you for visiting FacebookSinker.blogspot.com. Please don't miss any of the updates by subscribing to our RSS feed or email updates.

No comments:

Post a Comment

 
back to top