How to Remove Click Trap From Blogger Preview

Advertisements
Being a Blogger Developer or a common user, upon previewing your template or posts you might have noticed a click trap present there to stop you from clicking anywhere in the entire blog post. Recently, one of our users asked us that how to disable or remove click trap from blogger previews. It’s a fact that we all want to cross check our posts before putting them live on our blog, but the click trap produces amount disturbance that is certainly beyond the explanation.  Today in this article, we will show you how to remove the click trap from Blogger Preview.

What is Blogger Preview Click Trap:

Basically, it’s a layer build with CSS that prevents users from clicking anywhere in the website. There are no strong reasons why Blogger has implemented this trap. But Since Blogger is an open source CMS system so with some minor tweaks we can shape it according to our liking.

To find the click trap in blogger, you would need Google Chrome with Developer tools (comes built-in).  Go to Blogger ›› New Posts ›› Preview ›› Press F12  to open the developer tools and look for “blogger-clickTrap” in the chunk of HTML Coding. Check out the following screenshot for assistance:

How to Remove Click Trap from Blogger Preview:

To remove click trap from blogger all you need to do is to add the following piece of CSS coding into your blogger template this will override the default CSS and would remove the click trap from your blog.

Paste the following code above ]]></b:skin> tag in Blogger Template.

.blogger-clickTrap {
    display: none!important;
 }

We hope this tutorial helps you in removing the click trap from the blogger preview as it works with both custom and default blogger templates. Few designers, already include this code in their themes, but a few don’t. Do share your thoughts, If you like this post do not hesitate to share it on Facebook, Twitter, Google+.
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!

7 comments

January 28, 2014 at 12:51 PM

WOW,
thanks for sharing this useful tips and tricks. this is something completely new for me. great post bro...!!

January 28, 2014 at 1:23 PM

Hi, there is a reason in order to exist this "click trap". If you accidentally click on an external link of your blog in preview mode, the url address that goes to other blog shows exactly your blog ID. Blogger team should have added "clicktrap" because of it.

January 28, 2014 at 1:25 PM

Nice post as ever expected from MBL.
Stay Blessed :)

Editorial Team MOD
January 28, 2014 at 1:33 PM

Thanks for liking,

January 30, 2014 at 9:51 AM

Hi Bro, How To Create Sub-labels in Blogger, Pls help

Editorial Team MOD
January 31, 2014 at 10:00 AM

You cannot create sub Labels in blogger

February 6, 2014 at 6:56 PM

Awesome one! :D
One thing that I want to know "when ever I am trying to comment with Open ID using my blogger hosted website I am getting error What could be the problem" ?

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 - 2018. MBL Networks, All Rights are Strictly Reserved.