Add Social Content Locker In Blogger

;
Hi guys, today I am bringing you the most fantastic Widget which helps to increase our Blogs traffic
By Sharing. It Is Called Social Content Locker which helps to share our blog to unlock the content. You may have seen related to this content locker in different surveying sites where we must share the page to view hidden text, downloads and much more.
So, lets add this special widget in our blog.

Open your blog account
Go To Blogger Dashboard
Select Your Blog and click On Layout
Click On Template and select Edit HTML
Search For This Code </head>
paste the below code just below the code

<link href='http://mybloggerlab.com/StyleSheet/locker.css' rel='stylesheet' type='text/css'/>

Now, save your template

Now, Follow My another steps

Click On The Blog post where you want to add this
Click On Edit post
Select HTML in place Of Compose button
paste The Code There

<article id="default-usage">
<div class="to-lock" style="display: none;">
       
<!--Hidden Content Starts (You can Use HTML BELOW)-->

<div style="text-align: center; margin-bottom: 20px;">
<img src="Add_Hidden_Image_Here" alt="" style="margin: auto;" />
</div>

<div style="text-align: justify">
Add Your Hidden Text Here
</div>

<!--Hidden Content Ends (You can Use HTML ABOVE)-->

</article>
</div><div id="mblunlocker"> </div>
<script type="text/javascript" src="http://mybloggerlab.com/Scripts/lock.js"></script>
 
<script>
jQuery(document).ready(function ($) {
$("#default-usage .to-lock").socialLock({

text: {
header: "Share it To Unlock This Content",
message: "Yes, this is Social Locker. Just try it, click on one of buttons."
},

style: "ui-social-locker-secrets",
buttons: {
order: ["twitter", "facebook", "google"]
},

// twitter options
twitter: {
url: "http://www.twitter.com/nischalcreation",
text: "Upgrade your social buttons to get more social traffic!"
},

// facebook options
facebook: {
url: "http://www.facebook.com/nischalcreation",
appId: "408184442589211"
},

google: {
url: "NischalKhanal123"
}
});
});;;;
       
</script>

Now, Change The Following Highlighted Lines

Change Add_Hidden_Image_Here with Your Hidden Image
Change Add Your Hidden Text Here with your hidden Text
Change nischalcreation with your Twitter Username
Change nischalcreation with your Facebook page Link
Change NischalKhanal123 with Your Google plus Username