Blogging Tips

How to Show Images only in Blogger’s homepage and hide from post page

How to Show Images only in Blogger's homepage and hide from post page
Looking for how to add a custom
posts thumbnail in blogger or how to hide a particular picture/image from your posts
in Blogger and make them visible on your homepage as Thumbnails. Other
platforms such as WordPress enjoys this feature when creating your post. You
have an option to choose a specific image to show as thumbnail on your blog
homepage for that post.
This feature makes your site
looks professional and nice when you have an image to support the post title
and maybe snippet too or you dont want to display the whole image in order to
attract readers to read the full content.  Now, lets start the tutorial.
Step 1: Go to
Blogger Dashboard -> Template -> Edit Html
How to Show Images only in Blogger's homepage and hide from post page

Step 2: Click
anywhere in Html Editor and press CTRL+F from your keyboard, a Search Box will
be appear in top right corner of HTML
Editor
.
Step 3: Copy the
below code and paste in Search Box then hit ENTER
]]></b:skin>
How to Show Images only in Blogger's homepage and hide from post page

Step 4: Copy
given below CSS code and paste it immediately after/below this ]]></b:skin>

<b:if cond=’data:blog.pageType != &quot;index&quot;’><style>.hideimage{display: none;}</style></b:if>

How to Show Images only in Blogger's homepage and hide from post page

And then click Save
theme
to save the Template

(adsbygoogle = window.adsbygoogle || []).push({});

Step 5:  Now, every time you create a new post, add
your image (the one you wish to hide) first and then move to the HTML editor.
Then search for the code for that image which will appear
like the below;
Kindly note that this html code for the image can be located
anywhere within the post, depends on where you have the uploaded image in post
(could be in the Beginning, Middle or End)
Step 6: Then replace
the code highlighted below in caption with code hideimage
How to Show Images only in Blogger's homepage and hide from post page
How to Show Images only in Blogger's homepage and hide from post page
And you are done. You will need to be repeating Step 5 and 6
for every post you create.
Kindly drop you comment and let us know your experience.

Loading...

Andre

Andre is a network engineer with a solid technical background and a proven record in building and troubleshooting computer systems, networking, website design and blogging with broad knowledge on call center operations and administration. Above all, a man with great desire in sharing his knowledge and views, cutting across technology, social and politics.

Related Articles

Leave a Reply

Your e-mail address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Back to top button
Close

Adblock Detected

Please consider supporting us by disabling your ad blocker