Monday, March 24, 2014

How to create social content locker using jQuery plugin

I saw a website where for some work and at the main content they add a box with message to The content is locked! Please like us to to unlock content. So I found the way how he did that and found a jQuery plugin added  to do this so decided to give my reader this functionality so the can implement in there web application and give useful data with little contribution like tweet, like, plus or share on social network and get information they want.

I have used a jQuery plugin which add social media buttons for Twitter tweet, follow, Facebook like, Google plus or LinkedIn share instead of your content, actually it hide your data and show buttons once you like or tweet it will hide buttons and show you content and create a cookie on your browser so you will get content every time until cookie available on your browser.

Include jQuery and Plugin:
jQuery to initialize social locker:
In above jQuery we give our links to user to like or share and initialize social locker plugin for a div with id lock-my-div and that div will be replaced with social content and your defined message once user perform any activity it will hide that social buttons box and show your content div.
CSS used to beautify the display:
You can customize CSS as per your website layout.
Content div replaced with social buttons
DOWNLOAD CODE                  DEMO

1 comment:

  1. Hi !!! i want to download the script... i subscribed to rss feed but the scripts are not downloading