Unique tips of blogging

How to Create a Social Content Locker for Blogger or Wordpress

Hi my friends, this post will be about an awesome tutorial on how to make a social content locker in Wordpress and blogger blogs.



but first let me explain why you need to use a social content locker on your blog.

Social content locker can boost your social traffic to a new level, Also its help boosting your website ranking to a new level.

For WordPress blogs, you can find many plugins for social content locker but if you have a blogger blog so you will need to add an HTML code to your template. Do not be worry. it's so easy as i'll explain later.


First let me to start with some cool social content locker plugins for WordPress.

 Automatic Social Content  Locker plugin to lock all the post

This plugin locks all the post automatically, so your visitors can not see your post until they hit like-facebook button, hit Google+1 button or tweet your desired URL.


Share locker plugin

Share Locker is another cool plugin for Wordpress, your visitors can unlock your posts only if they click on a social buttons like Twitter tweet, Facebook like,  Vk llike or Google+1.

Also there's many other plugins for Wordpress like:

  • Social locker by onepress
  • Tweet Content Locker
  • Easy Social Locker
  • Social Content Locker

Now let me to show for you how to create social content locker for Blogger blogs    

Step 1:

  • Login to your blog account.
  • Go to dashboard.
  • Click on "template" at the left sidebar.
  • Click on "EDIT HTML".
  • Use ctrl+F keys to search for </head> in HTML .
  • After you find </head>  put following code direct before </head> .

<script src='http://code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'/>
<link href='https://dl.dropboxusercontent.com/s/wty2pc0nbzhjewb/lockercss.css' rel='stylesheet'/>
<script src='http://dl.dropboxusercontent.com/s/p1zg8pbc9td0wgx/lock.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function ($) {
$('#default-usage .to-lock').sociallocker({
buttons: {order:["facebook-like","twitter-tweet","google-plus"]},
twitter: {url:"http://twitter.com/your-twitter-id"},
facebook: {url:"https://www.facebook.com/your-facebook-id"},
google: {url:"https://plus.google.com/your-google-id"},
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"
});
});
//]]>
</script>


Remember: You need to replace red links with your own social links.

Step 2:


    When you want to add social content blocker to any of your posts in you blogger, Switch to html section and add following code:


    <article id="default-usage"> <div class="to-lock" style="display:none;">  -- Hidden Content part -- </div></article>


Remember: You need to replace -- Hidden Content part -- with the part of content you want to lock.
0 Komentar untuk "How to Create a Social Content Locker for Blogger or Wordpress "


Back To Top