Wednesday, 30 April 2014

How to put Social Locker for Blogger Blogspot

How to put Social Locker for Blogger Blogspot



This article will be focusing maybe you or other bloggers that really wants / likes Social Marketing. But increasing your Facebook Page likes , Twitter shares, and Google Plus shares. You will need lots of hard work and of course money to advertise. But to make your goal more possible, We have made an Advance Social Locker for Blogger or Blogspot Blogs. Yes this social locker comes from wordpress but we work hard and converted it to a Blogger Widget.

How to put Social Locker for Blogger Blogspot

WIDGET DEMO

How the Social Locker widget for blogger works?

This Blogger Social Locker widget is really awesome because by using your own strategy, you can gain about 50 likes or shares a day. But the best use of this widget is by hiding your Download links on your Blog, Then to unlock it, they need to like your page, tweet , or Google + your article. And after they made their action, when they exit and the other day that they open your blog, They will not be seeing the social locker in the article where they made their recent action (share, like , +). The below procedure will guide you on how to insert it on your Blogger Blog or any HTML website, You can also see the DEMO of the widget below where you need to unlock the content of mine as a sign of your presence in our Blog.

How to put Social Locker for Blogger Blogspot:

  • First thing you need to do is to Login to your Blogger Blog.
  • Go to templates then Edit HTML.
How to put Social Locker for Blogger Blogspot tronicflow

  • Paste the code below after <head>.
<link href='https://googledrive.com/host/0B34mC1Fbl7PmQnFySC1jaGs1OUU/tronicflow-social-locker-css.css' rel='stylesheet' type='text/css'/>

  • Then to make the Social Locker Work, You need to insert this code below inside your post on the HTML tab.

<article id="default-usage">
    <div class="to-lock" style="display: none;">
<!--Hidden Content Starts (You can Use HTML BELOW)-->
 
    <br />
<div style="text-align: justify;">
THIS IS YOUR HIDDEN TEXT! </div>
<!--Hidden Content Ends -->
 
    </div>
</article>
    <br />
<script src="https://googledrive.com/host/0B34mC1Fbl7PmdFFLRVVvOG5iNkk" type="text/javascript"></script>
 
    <script>
    jQuery(document).ready(function ($) {
    $("#default-usage .to-lock").socialLock({
 
    text: {
    header: "THE CONTENT IS LOCKED!",
    message: "To unlock the content, Please use one of the social buttons below. Thank you for your support!"
    },
 
    style: "ui-social-locker-secrets",
    buttons: {
    order: ["twitter", "facebook", "google"]
    },
 
    // twitter options
    twitter: {
    url: "HTTP://YOURSITE.COM",
    text: "TWEET TEXT"
    },
 
    // facebook options
    facebook: {
    url: "http://www.facebook.com/yourpage",
    appId: "337462366354755"
    },
 
    google: {
    url: "YOUR DOMAIN OR POST URL"
    }
    });
    });;;;
       
    </script> 

BLOGGER SOCIAL LOCKER CUSTOMIZATIONS:

  • THIS IS YOUR HIDDEN TEXT! - Change it to your own content that you want to be hidden and will be shown when they use the social buttons. You can also use HTML inside it.
  • HTTP://YOURSITE.COM - Obviously your site's URL or your post's URL.
  • TWEET TEXT - You can put your site's cool Meta Content in here so people that sees this tweet on twitter will want to click it.
  • yourpage - Your Facebook Page URL.
  • YOUR DOMAIN OR POST URL - Your post URL or your DOMAIN.

FINAL WORDS:

If you like our Social locker widget, Please make a comment below and drop your suggestions or problems. As you can see on the DEMO above, The Social locker is not showing the Facebook like button because we have a jquery that is overriding the widget codes. But it should work on yours.
You are Free to share this widget on your Blog but make Sure you give us credits. Thank You.

No comments:

Post a Comment