How to Create a Social Content Locker in Blogger Blog

Hi guys, it’s me again with yet another cool tutorial on How to Create a Social Content Locker in Blogger Blog. Yes you read it right!! With this method you can lock any content of your blog with social buttons. Isn’t it amazing ??

What is a Social Content Locker and Why to use it ?

Well, a Social Content Locker allows you to lock any part of your content on a webpage until a user clicks one the social buttons (Tweet, G+, Facebook Like). This way you get more tweets, likes, shares etc thus giving you huge exposure.

How to Create a Social Content Locker in Blogger Blog
We all put social sharing buttons on our blog posts/ websites but do we get enough shares?? No we don’t!! Only a small portion of our viewers help us by sharing our content while others don’t consider it.
It’s not the mistake of our viewers!! You should give them a reason to share or like your content, and this Social Content locker does the same for you. We will provide our viewers a reason to like or share our content and thus this will help us in getting huge traffic as well as exposure.

Method to Create a Social Content Locker in Blogger Blog

There are dozens of such social content locker plugins for WordPress blogs but we don’t have any plugins on blogger platform. Not to worry!! We have come up with one such great Locker which looks cool and stylish. And at the same time it will serve your purpose.


  • Go to “Template” and click on “Edit HTML”
How to Create a Social Content Locker in Blogger Blog


  • Search for </head> and paste the following code Above it. This line adds jQuery library in our template. Most of the templates already come with it, so in that case you can skip this step.

<script src=’‘ type=’text/javascript’/>


  • Now again search for </head> and paste the following code Above it.
How to Create a Social Content Locker in Blogger Blog

<link href=’’ rel=’stylesheet’/>

<script src=’’ type=’text/javascript’/>

<script type=’text/javascript’>

jQuery(document).ready(function ($) {

$(‘#default-usage .to-lock’).sociallocker({
buttons: {order:[“facebook-like”,”twitter-tweet”,”google-plus”]},
twitter: {url:””},

facebook: {url:””},

google: {url:””},

text: { header: “Like us To Unlock This Content”,

message: “This content is locked. Like us on Twitter, Facebook or Google plus to unlock it.” },
locker: {close: false, timer: 0,},

theme: “secrets”


  • Replace the links with your links where you want likes or shares.
  • This is just a one time setup. Whenever you want to show this locker in any of your blog post or page, just add this code in your HTML blog post editor. Replace ADD YOUR CONTENT HERE with your content which you want lock.

<article id=”default-usage”>
<div class=”to-lock” style=”display:none;”>


Final Words

We are still working up for an advanced version of this locker which will automatically fetch the post link and thus you won’t have to add any links in your html file everytime. I hope you this tutorial will still help you gain some social signals and boost your traffic. Do leave your valuable comments below.
Get More Secret Guides & Offers

Get More Secret Guides & Offers

Subscribe now and start getting premium tricks and guides related. 

You have Successfully Subscribed!

9 thoughts on “How to Create a Social Content Locker in Blogger Blog”

  1. Hi. I need facebook share function and button as my contect locker. I tried everything, but I simple can’t put the right code together. Can you please help me? Thanks.

  2. Thank you for this article, I have tried this solution but there is one problem is the facebook like button don’t work and give this error Unable to load SDK script for facebook. Please make sure that nothing blocks loading of social scripts in your browser. Some browser extentions (Avast, PrivDog, AdBlock etc.) can cause this issue. Turn them off and try again. So what is the solution

  3. Waa looking for this from ages.. glad that i find it here on my idol’s site 😀

    Long live iftiseo 🙂

  4. Getting error while installing Social Content Locker in Blogger Blog
    when I add this script in template –

    I getting the following error on saving –

    Error parsing XML, line 212, column 13: Open quote is expected for attribute “src” associated with an element type “script”.
    How to solve this ?

  5. Not Working for me firstly it showing error of ” Error parsing XML, line 681, column 13: Open quote is expected for attribute “src” associated with an element type “script”. ” then i just change inverted commas single to double so error is removed but when i follow all the steps the content locker is not appear on the blogger please suggest me .

Leave a Comment

Your email address will not be published. Required fields are marked *