RemlinkJS: How to Remove Hyperlink from Specific or All Blogger Post Images

This article will discuss how to remove links from either all or specific images in blog posts, especially those using Blogger in the easiest way even for novice bloggers.

Every time we upload an image into our posts on blogger, the photo can be clicked because there is a link that goes to the image. This is not what WordPress does where we can choose to put a hyperlink into the image or not. Blogger's default setting is to add a hyperlink to an image uploaded by blogger and many bloggers are asking how to remove a hyperlink from an image uploaded on blogger.

Assuming you are using a custom Blogger template, you most likely have seen that couple of the outsider created templates does not supports Lightbox usefulness, which causes images to be opened in another tab window at whatever point they are clicked by the users. Since, Blogger use Picasa web collection to host your blog's images, so at whatever point user clicks on a picture present on your site it at last takes them to an alternate destination, which causes increase in the bounce rate and decrease in the ad sales because your users are not changing over they are coming from one end and leaving from the other. - Jarial at HowBloggerz

So, basically, many bloggers don't like hyperlinks in the images they upload to their blogger posts. Therefore, many are looking for ways to remove hyperlinks in images in their blogger posts.

Hot Post: 5 Elements that Make Stories Interesting and Entertaining

Actually, there are many ways to remove hyperlinks from blog post images. For example, you can edit your post via the HTML editor and remove the anchor tag from the image. Or, you can disable hyperlinks from all images in every post on your blog by editing the HTML code of your Blogger template. Unfortunately, not all bloggers can do that and removing the wrong anchor tag can cause the uploaded image to not appear in the post unless we add it back.

Among the bloggers who want to remove hyperlinks from their blog post images, many of them do not want all the hyperlinks removed. That is, they want to leave some of the images in their blog posts hyperlinked. Imagine if you have a blog about wallpapers. You want your blog visitors to be able to get the wallpaper in the original size, right? This is probably the reason Blogger puts hyperlinks into the images we upload in blog posts: so that visitors can see the image in its actual size.

If we look at the HTML code of the image that we uploaded to our blog post, we will see that there is an image attribute that states the original size of the image and the size displayed in the post; smaller or larger, depending on your choice when adding the image to your post.

<div class="separator" style="clear: both; text-align: center;"><img alt="" border="0" data-original-height="250" data-original-width="800" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXgDqBXlGE3mLjvV9C59a9fANnZcoeEibejlh5nuhoB4VrmnLW8OI17wjn1PMe3tei1yAsw6atrY7lXVGJLCOBZhX8Mayw3izacxxwXjuFPH92yehQvoM6OrndRZ1i8p7wpqfw2zM8o3gJ/w640/descriptive+text+%2528800+x+250%2529.jpg" title="" width="640" /></div>

We have written a few lines of JavaScript code that works to remove hyperlinks from blog post images on Blogger. You can remove hyperlinks from all blog post images or hyperlinks from specific images (in this post, the first image's hyperlink is removed by following the steps below). All you need to do is follow these steps:

Removing Hyperlinks from All Blogger Post Images

1. Copy the JavaScript code we put in this post (we call it remlinkJS);
2. Change the variable divClass value from remlink to separator;
3. Place it in the HTML code of your blogger template just above the </body> tag;
4. Save your Blogger Template

Removing Hyperlinks from Specific Blogger Post Images

1. Copy the JavaScript code we put in this post (we call it remlinkJS);
2. Do not change the code
3. Place it in the HTML code of your blogger template just above the </body> tag;
4. Go to the post that you want to remove the image hyperlink, edit the post in HTML editor;
5. Locate the HTML code of the image that you want to remove the hyperlink;
6. You will see code like <div class="separator"...>;
7. Add remlink after the separator so it will be seen like this <div class="separator remlink"...>;
8. Save it.

Before adding remlink class:

After adding remlink class:

RemlinkJS Code:

<!--RemlinkJS-->

<script type="text/javascript">

//<![CDATA[

var divClass="remlink";

for(var a=document.getElementsByClassName(divClass),b=0;b<a.length;b++)if(a[b].hasChildNodes())for(var c=a[b].childNodes,d=0;d<c.length;d++)c[d].removeAttribute("href");

//]]>

</script>

That's all you need to do to remove the hyperlink from all or specific images of your blog post in Blogger. I hope that this can help you. Please backup the HTML code of your Blogger Template before you do this. And, if you want to minify any JS code, feel free to use JS Minifier that we put on this blog; RemlinkJS has been minified and optimized.

JS Minifier