How to Remove Hyperlinks from Post Images in Blogger

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.

Post a Comment