How to Remove Hyperlinks from Post Images in Blogger

Advertisements
If you are using a custom Blogger template, then you probably have noticed that few of the third-party developed templates does not supports Lightbox functionality, which causes images to be opened in a new tab window whenever they are clicked by the users. Recently, one of our users asked us that How to Remove Hyperlinks from Post Images in Blogger? The easiest way to remove hyperlinks for post images in blogger is to simply revert to the HTML Tab in the blogger post editor and remove the hyperlink. However, what if you have to edit gazillion posts? Today in this article, we will show you How to Remove Hyperlinks from Post images in blogger.

Since, Blogger use Picasa web album to host your blog’s images, so whenever user clicks on an image present on your site it ultimately takes them to a different destination, which causes increase in the bounce rate and decrease in the ad sales because your users are not converting they are coming from one end and leaving from the other.

WordPress users have a slight edge because the images they host are uploaded on their own domains like example.com/img/test.png but in blogger you have to use Picasa that provides URLs somewhat like b.blogspot.com/asdasd1600/test.png which is bad for SEO.

The Solution:

The first thing you need to do is to login into your Google account. After logging in, go to Blogger dashboard >> your site >> Template >> Edit HTML and search for the Skin tag. After finding the skin tag, just above it paste the following chunk of CSS code. Once everything is done, Save the template by pressing “Save Template” button present on the top right side of your computer screen.

.post img, .post img a{
position: relative;
z-index: -100; }

OR

.post img, .post img a{
 position: relative;
 z-index: -1; }

.post-outer{
position: relative;
 z-index: 1 !important; }

OR

.entry{
position: relative;
z-index: 1; }

.hentry img, .separator{
position: relative;
z-index: -1; }

OR

.post{
position: relative !important;
z-index: 10 !important;
}

.hentry img, .separator{
position: relative !important;
z-index: -1 !important;
}

Congratulations: You have successfully removed Hyperlinks from post images in blogger. Now whenever, users will click any of the images present in the posts it would not open them in a new tab which may result in decrease of bounce rate.

We hope this article may have helped you in learning how to remove hyperlinks from posts in blogger. Thought, Lightbox works perfectly on our custom develop theme, but we are still using the same technique, so you all should try it too. Follow us on Twitter and Facebook.

Advertisements

The Editorial Team of MyBloggerLab consists of a group of Professional Blogger geeks Led by Syed Faizan Ali (Founder of MyBloggerLab).

Comment With:
OR
Choose Wisely!

5 comments

September 18, 2013 at 9:24 PM

I really wanted this . Thank You Syed for your tutorial :)

Regards,
Rizwan @ Blogger Kid

September 19, 2013 at 2:28 AM

good job +Syed,

October 1, 2013 at 2:36 AM

Syed Faizan ali, I want to become a writer, something like a guest author at My Blogger Lab...

I can write articles on the topics like, Blogging tutorials, Blogging tricks, Tech, tips and tricks, and many more...

Editorial Team MOD
October 1, 2013 at 3:01 AM

Sure, You can send us your Guest posts via contact.mybloggerlab.com

Cheers!

December 29, 2013 at 1:50 AM

Thank you so much for this code! Have been searching for it forever <3

http://shopkeeperjoe.blogspot.sg/

Post a Comment

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.

Helping You to do Cool Things With Blogger Since 2012™.

© Copyright 2012 - 2016. MBL Networks, All Rights are Strictly Reserved.