How To Create and Install a Social Content Locker in Blogger Posts

How many people are using social networking sites to increase traffic to their website? There are tons of professional bloggers all depends on the traffic to society. However, it is extremely difficult to get Social quickly. Although, there are some tools that help to increase the social, but it was not enough. If we want to dominate the social web, then we have to make use of every opportunity we have. For that reason, we have come up with one more expected Widget society of all time, Locker Content society.



You use the tools of social exchange in each and every page of your site? However, there are social contact on your bottom. Actually, the problem is that people love your content. Therefore, they are not pressing social and instead read out from the website of you because they do not care about traffic website of you. Ask people want, +1 or increase the access to your content is in fact a way appropriate enforcement to share it on the web social.

Locker society consists of three key social and display a locker horizontally. The society consists of Facebook, Twitter and Google Plus. Whenever a person appears to be Like, Tweet or Plus One button will display the hidden content. This allows a person to be tracked in real society.

How To Install Social Content Locker in Blogger?

The Steps are extremely straightforward that even a small kid can follow it. There is no need of learning any Html coding because all we have to do is to copy paste the coding. Just follow the following instructions.
Go To Blogger.com >> Template >> Edit HTML >> Proceed.
Search for </head> just and above it paste the following CSS Coding.
<link href=’https://dl.dropboxusercontent.com/u/137869302/lockercss.css’ rel=’stylesheet’ type=’text/css’/>



After pasting the coding save the template and proceed to next step.
How To Add Social Content Locker in Blogger:

Now whenever a person wants to add a Social content locker in his specific article, then he can follow the following instructions. (Remember: The same steps can also be used on Gadget Area and even in a template).
Go To Blogger.com >> New Post.
Select the HTML Tab from the blogger post editor and paste the following coding.
<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=”https://dl.dropboxusercontent.com/u/137869302/lockers.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.gameirz.blogspot.com”,
text: “Upgrade your social buttons to get more social traffic!”
},
// facebook options
facebook: {
url: “http://www.facebook.com/”,
appId: “418044881593120”
},
google: {
url: “http://www.gameirz.blogspot.com”
}
});
});;;;
     
</script>