How To Add Tweet To Unlock Twitter Widget in Blogger Blog

How many people have tried our Social Content Locker? It’s a gadget that hides the content until a person either shares it on Facebook, Tweet it on Tweeter, or +1 it. The idea behind that widget was to provide more social exposure to the Bloggers and so far that Social Content locker has received a tremendous response from the audience. Keeping that in mind, we have designed another Content hiding widget namely “Tweet to Unlock". This name is not new for WordPress users but for Blogger users it surely a new thing for them. Though, we have already released a Facebook Like to Download Widget, about few months ago, but today in this article, we will learn how to create a Tweet to unlock widget in Blogger.

Tweet to Unlock is a proven and the most trusted gadget to magnetize real Twitter followers. On the other hand, Tons of WordPress webmasters are already using this technique to get more exposure on their Twitter account. A person can easily utilize this widget to lock downloads, videos, content, coupons and etc. It will not only increase your social audience but would also

bring some significant traffic from twitter.

From its title, it is somewhat clear that it consists of Twitter Tweet buttons. Whenever, a person would Tweet your content with the help of our “Tweet to Unlock” widget button. It would start displaying the hidden content. However, those who don’t have twitter an account might get frustrated if they remain unable to unlock the content. For that reason, we have also added a CLOSE button through users can easily get access to the content. Feel Free to enjoy the Following Real time Demo.

This content is locked. Please support us, tweet to view the hidden content.

Tweet

How To Install Tweet To Unlock Widget in Blogger?

To keep the tutorial as straightforward as possible, we have started to Host CSS on our server so that, users can easily uninstall it without any problem whatsoever. Consider the following steps and follow them correctly.

• Go To Blogger.com >> Template >> Edit HTML >> Proceed.
• Search for </head> just and above it paste the following CSS Coding.

<link href='http://mybloggerlab.com/StyleSheet/tweetlock.css' rel='stylesheet' type='text/css'/> 

• After pasting the coding save the template and proceed to next step. 

How To Add Tweet to Unlock Widget in Blogger:

Now whenever a person wants to add a tweet to unlock 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.

<div class="to-lock-simple 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)-->
</div><div id="mblunlocker"></div>
</article>

<script src="https://mybloggerlab.googlecode.com/files/tweetlock.js"></script>

         
<script>
jQuery(document).ready(function($) {
$("#default-usage .to-lock-simple").toTweet({
url: "http://www.myblogeffect.blogspot.com",
style: "ui-locker-purity",
locker: {close: true},
twitter: {text: "The Best Blogger Resource Website",
hashtags: "mybloggerlab"
}
});
});;

jQuery(document).ready(function($) {
$("#close-icon-usage .to-lock").toTweet({
url: "http://www.myblogeffect.blogspot.com" + Math.random(),
style:"ui-locker-solidity",
ext:"Tweet or click on the Close Button at the corner!",
locker: {close: true},
twitter: {text: "The Best Blogger Resource Website",
hashtags: "myblogeffect",
count: 'none'
}
});
});;
</script>

• Tweeted URL: Replace http://www.myblogeffect.blogspot.com with the URL that you want people to tweet.
• Disable Close Button: If anyone don't want to display the Close button then he can replace true to false from the above JavaScript coding
• Changing Twitter Message: Replace The Best Blogger Resource Website with the message that you want people to tweet. 
• Changing Hash Tag: In order to add a hash tags (#) to the tweet, replace myblogeffect with your personalized keyword.

All Done: That's All, we hope this widget would help everyone to magnetize more twitter followers and social exposure. Feel free to leave your reply.

From The Editor's Desk:

Since, all the magic is done with the help of JavaScript. Therefore, if any users would disable the JavaScript of his browser, then it would obviously stop working. The main reason behind using the jQuery is to keep your content Search engine friendly. Another way of accessing the content is the Source Code. What are your views about the Gadget? Take a lot care till then, Peace, Blessings and happy tweeting.

Share on Google Plus

About Education

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.