Social content locker

Here is the code of Social Content Locker on blogger, copy all the code and post it in html part of your website.

<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="nbtunlocker"> </div>
<script type="text/javascript" src="https://sites.google.com/site/cssedited/css/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: "put your url here",
text: "Put text here"
},
// facebook options
facebook: {
url: "http://www.facebook.com/pages/Bloggers-World/683731511697782?ref=hl",
appId: "300870940097878"
},
google: {
url: "put your blog url here"
}
});
});;;;
     
</script>