Lock Part of Your Blog's Content to Increase it's Social Media Shares Now

Sharing a content to unlock the best part of it is the new trend nowadays and it is also a helper when it comes to making your content go wild.

share to unlock blog content


On WordPress, there is a plugin known as Share to Unlock. It does this particular task perfectly and easier. It hides specific part of ones content inorder to make visitors share those contents before seeing that area.

The message the visitor will see on that hidden content is share to unlock content. This feature is now available to blogspot users. It is a way of getting your visitors to share your content forcefully without any embarrassment or disappointment.

Procedure to add the share to unlock content on blogger blog


  • Login to your blogger dashboard.
  • Select the blog you want to add the plugin.
  • Click on theme or template. 
  • From the page that will be shown, click on edit Html or Download your theme and edit it. 

  • Now search for </head> and add the below code just before it. 
  • <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>


  • Search for </body> and paste this long code below just before it. 


<style>
.secret {

 text-align:center;
 display:none
}
.secret-share {
    padding: 20px;
    text-align: center;
    border: 3px solid #ddd;
    background: #f8f8f8;
}
a.download-btn {
    text-transform: uppercase;
    font-size: 22px;
    background: #7b7b7b;
    padding: 10px 20px;
    display: inline-block;
    border: 1px solid #000000;
    text-decoration: none;
    color: #fff;
}
.secret-share .fb-like {
 margin-top: 0;
 top: -7px;
 position: relative;}
.secret-share .twitter-share-button {
    margin-right: 25px;
}
</style>
<script type='text/javascript'>
//<![CDATA[
/* Facebook */
(function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/all.js";
     fjs.parentNode.insertBefore(js, fjs);
 }(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
    // init the FB JS SDK
    FB.init({
      status     : true,                           
      xfbml      : true                             
    });
    FB.Event.subscribe('edge.create', function(href, widget) {
        $.event.trigger({
            type: "pageShared",
            url: href
        });
    });
};
/* Twitter */
  window.twttr = (function (d,s,id) {
  var t, js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
  js.src="https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
  return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
}(document, "script", "twitter-wjs"));
twttr.ready(function (twttr) {
    twttr.events.bind('tweet', function (event) {
        $.event.trigger({
            type: "pageShared",
            url: event.target.baseURI
        });
    });
});
/* Google Plus */
(function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
function plusOned(obj){
    console.log(obj);
    $.event.trigger({
        type: "pageShared",
        url: obj.href
    });
}
/* Listen for the pageShared event */
$(document).on('pageShared',function(e){
    if(e.url == window.location.href){
        $(".secret").show();
        $(".secret-share").hide();
    }
});
//]]>
</script>


  • Click on save template.
  •  Go to your post now and post the code below at the spot you want to lock. You need to go to html side.

<div class="secret">

THE CONTENT THAT YOU WANT TO HIDE SHOULD COME IN HERE....</div>

<div class="secret-share">
<p>share on Facebook / Twitter / Google to unlock hidden content.</p>
<span class="fb-like" data-layout="button_count" data-send="true" data-show-faces="false" data-width="90" expr:data-href="data:post.url" style="margin-right: 25px;"></span><a class="twitter-share-button" data-count="horizontal" data-related="" data-via="whitehatmove.com" expr:data-text="data:post.title" expr:data-url="data:post.url" href="http://twitter.com/share">Tweet</a><span class="g-plusone" data-callback="plusOned" data-count="true" data-size="medium" expr:data-href="data:post.url"></span></div>


In the above code, replace THE CONTENT THAT YOU WANT TO HIDE SHOULD COME IN HERE.... With your content with your contents and save.

I hope you are able to lock your content now. If there is any confusion or suggestions, we will welcome it. Keep visiting for more useful posts. I'm Keen to making your blog the best online.

No comments:

Post a Comment



We Love To Hear From You But Don't Spam Us With Links!

Do you want to be notified when I reply your comment? Tick the "Notify Me" box.

If your comment is unrelated to this post or you're trying to ask question about an old post, please drop it at the related post

Thank You.