5 Mar 2014

Show Blogger Image only in Homepage and Hide it in Post Page



Step 1. Go to Dashboard - Template - Edit HTML



 Step 2. Click anywhere inside the code area and press the CTRL + F keys to open the search box:

 Step 3. Type or paste this code inside the search box then hit Enter to find it:
    }]]></b:skin>
Step 4. Paste the following code just below it

<b:if cond='data:blog.pageType != &quot;index&quot;'>
<style>
.hidepic{
display: none;
}
</style>
</b:if>
Step 5. Save the Template.

Now, each time you create a post, first add the picture that you want to hide and then switch to the HTML tab where you'll see the HTML code of the image that you added - it will look something like this:

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggbmaXJ4va9i56jDe8YEejDUHncIGqf03Y0YBFpgnq93nw5K1N-tBDjacgEb_2k4SMh2pKu4wHWS83YHW8but8ktgqEdPM7CKM-R_yI8ncxeQWuYc_FwEqeaDV9AjpnVc0ToJ4IWzhjz0/s1600/fire_bird_by_fhrankee-d32af8v.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggbmaXJ4va9i56jDe8YEejDUHncIGqf03Y0YBFpgnq93nw5K1N-tBDjacgEb_2k4SMh2pKu4wHWS83YHW8but8ktgqEdPM7CKM-R_yI8ncxeQWuYc_FwEqeaDV9AjpnVc0ToJ4IWzhjz0/s320/fire_bird_by_fhrankee-d32af8v.png" width="320" /></a></div>

Note: it should be at the exact location where your image has been added 
(if the image is at the middle of the text, then the code should be found at the middle)

Step 6. Replace "separator" with "hidepic" - see the screenshot below:
Show Blogger Image only in Homepage and Hide it in Post Page

Show Blogger Image only in Homepage and Hide it in Post Page


If you need more help, please leave a comment below.

0 comments:

Post a Comment

 

Recent post

Ping your blog, website, or RSS feed for Free Likerr.eu

Contact Us

Name

Email *

Message *