October 26, 2013

How to Hide Specific Posts From Homepage in Blogger

Hiding a specific or certain post from the homepage of your blogger blog might appear to be a repulsive act, but it does make sense on a few occasions. Recently, one of our users asked us how to hide specific posts from your Homepage in Blogger? This technique is essential for those webmasters who no longer want to display a post that is appearing on their homepage. The reason could be anything the post might be outdated, or it could be a giveaway article that does not look relevant to be displayed on homepage. Today in this article, we will show you how to hide specific posts from the homepage in blogger.

 The first thing you need to login into your blogger account and go to Templates >> Edit HTML (be sure you have taken a backup of your template, it is a good practice in case something went wrong you can use the backup) and search for the following code. You will find the below code somewhere near the BLOG1 Code.

<div class="date-outer">

Now correctly replace the above code with the following lines of coding by making sure you are exactly copying and pasting the right code. If you miss a single thing, then the code will not work and you may face some kind of errors.

<div class="date-outer"
    <b:if cond='data:blog.pageType == &quot;index&quot;'>
    <b:if cond='data:blog.searchQuery == &quot;&quot;'>
    <b:if cond='data:blog.searchLabel == &quot;&quot;'>
            <b:if cond='data:post.url == &quot;Your-Post-Link&quot;'> style=&#39;display:none;&#39;</b:if>
            <b:if cond='data:post.url == &quot;ANOTHER POST URL&quot;'> style=&#39;display:none;&#39;</b:if>
          </b:if>
          </b:if>
          </b:if>
       &gt;

After pasting the above code, now it is up to you which blog posts you would like to hide from your homepage. Replace Your-Post-Link with the URL of you post that you would like to hide from your homepage. You can hide multiple posts by adding more URLS in <b:if condition/> tag.

Congratulations: Once everything is done, save the template. Now go to your homepage and test if things are working according to the plan. If you follow the steps correctly, we are certain it would work just fine.

Alternative Method:

Every post has its own unique ID, so if we are able to find that unique id we can obviously apply display:none; CSS to hide it from our homepage. We have already written a tutorial on how you can find ID of your posts, so before moving ahead read that tutorial here.

Once you got your Post ID, go to Blogger.com >> Template >> Edit HTML and search for the ]]></b:skin>, and just above it paste the following CSS code. Rememeber. Do not forget to replace post-1234567 with your own Post ID which you would like to hide from your homepage.

<style>
<b:if cond='data:blog.url == ... >
#post-1234567 {display:none}
</b:if>
<b:if cond='data:blog.searchLabel == ... >
#post-8903456 {display:none}
</b:if>

We hope this tutorial, may have helped you in learning a few techniques through which you can hide a post from your homepage. Since, we have used display:none; css so the search bots will continue to index it as it is not completely removed from the source code of your website.

22 comments:

  1. Awesome brother ! .. Jazak Allah Khair ..

    ReplyDelete
  2. You can also move the article to an older date easily.

    ReplyDelete
  3. Seriously the way you write your posts is simply amazing, i am very impressed by you, i want to say the words and the knowledge you put in the post both are very impressive, i want to thank you for sharing such a great post and want to say i going to subscribe to your posts.

    Tehcnology Eater
    http://www.technologyeater.com/

    ReplyDelete
  4. Seriously the way you write your posts is simply amazing, i am very impressed by you, i want to say the words and the knowledge you put in the post both are very impressive, i want to thank you for sharing such a great post and want to say i going to subscribe to your posts.

    Technology Eater
    http://www.technologyeater.com/

    ReplyDelete
  5. Hi,

    Not working for me, any help,,

    ReplyDelete
  6. i didnt unsderstund how to hide more than one?

    ReplyDelete
    Replies
    1. Hi, You can hide more than one by finding their post ids and later on with display:none CSS. Please check the Alternative Method.

      Delete
  7. Thank you brother...God bless you

    ReplyDelete
  8. Can you help me with this?

    Error parsing XML, line 49, column 1: The value of attribute "cond" associated with an element type "b:if" must not contain the '<' character.

    ReplyDelete
  9. Assalamu alikum please tell me that how to show pages on home page like u have ''recommended pages for you''' please help

    ReplyDelete
    Replies
    1. Please follow this tutorial

      http://www.mybloggerlab.com/2013/09/how-to-display-related-articles-below-posts-in-blogger.html

      Delete
  10. Thank you! Works great & very useful.

    ReplyDelete
  11. Not working for me! Can you help me please?

    ReplyDelete
  12. Can't figure out what Skin tag is.. Any help?

    ReplyDelete
  13. i want to my every post not show on my home page because i am working different categories is it possible here is my site please give me sugession
    http://onlinepakistanofficial.blogspot.com/

    ReplyDelete
    Replies
    1. Hi,

      Here's a fix for you

      Add this code above </head> in your template

      <b:if cond='data:blog.url == data:blog.homepageUrl'>
      <style>
      .Blog {
      display: none;
      }
      </style>
      </b:if>

      Save Template.

      Delete
  14. Hi,
    I want to remove all the recent posts from main page what should I do? I dont want any of the posts to be displayed on the main page...Please help

    ReplyDelete
    Replies
    1. Add this code above </head> in your template

      <b:if cond='data:blog.url == data:blog.homepageUrl'>
      <style>
      .Blog {
      display: none;
      }
      </style>
      </b:if>

      Save Template.

      Delete

We’re eager to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.