Blogger Tips

Share to Unlock The Download Button

Share to Unlock The Download Button

Share to Unlock The Download Button , maybe my friend often find words like that. This means that the download link will appear after click on Facebook Like / Tweet or Recommend on Google Plus. Links are hidden usually premium link. Very reasonable, a download link exchanged with like, tweet or recomend on Google+. More concretely looks like the picture below:

Share to Unlock The Download Button
Tricks like this are very useful to strengthen its position in the SERP your blog, because sharing to social networking is one of the SEO Optimization. For my friend who wants to pursue this course, please understand it well mate steps:

Installation Code/Script

Step 1 : Install the jQuery Framework To display and hide the object, needed a touch of jQuery. Therefore, please attach this code above the </head>

<script src=’https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js’ type=’text/javascript’/>

Step 2 : Attach the CSS code above ]]> </ b: skin> or </ style>

.secret {text-align:centerdisplay:none}
.secret-share {padding:20px;text-align:center;border:3px solid #ddd}

Step 3 : Attach Script Viewer Button above </body>

<script type='text/javascript'>
//<![CDATA[
/* Facebook by www.leetblogger.com*/
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
status : true,
xfbml : true
});
FB.Event.subscribe('edge.create', function(href, widget) {
$.event.trigger({
type: "pageShared",
url: href
});
});
};
/* Twitter */
window.twttr = (function (d,s,id) {
var t, js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
js.src="https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
}(document, "script", "twitter-wjs"));
twttr.ready(function (twttr) {
twttr.events.bind('tweet', function (event) {
$.event.trigger({
type: "pageShared",
url: event.target.baseURI
});
});
});
/* Google Plus */
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
function plusOned(obj){
console.log(obj);
$.event.trigger({
type: "pageShared",
url: obj.href
});
}

/* Listen for the pageShared event */
$(document).on('pageShared',function(e){
if(e.url == window.location.href){
$(".secret").show();
$(".secret-share").hide();
}
});
//]]>
</script>

If your template already exists in the code something like that, please remove it and replace it with the code above. Do not forget to backup your template first.

Writing in the Post

To bring up the Like button, Tweet or Google Plus and also the object (download link) then the format of the post like this (written in HTML mode instead Comopose):

<div class=”secret”>
Link are hidden here</div>
</div>
<div class=”secret-share”>
Share Via Facebook/Twitter/Google Plus To see Download Link
<span class=”fb-like” data-layout=”button_count” data-send=”false” data-show-faces=”false” data-width=”90″ expr:data-href=”data:post.url” style=”margin-right: 25px;”></span><a class=”twitter-share-button” data-count=”horizontal” data-related=”” data-via=”kangismetdotnet” expr:data-text=”data:post.title” expr:data-url=”data:post.url” href=”http://twitter.com/share”>Tweet</a><span class=”g-plusone” data-callback=”plusOned” data-count=”true” data-size=”medium” expr:data-href=”data:post.url”></span></div>

6 Comments

6 Comments

  1. Tim IniBaruCerita

    April 25, 2014 at 7:40 am

    Not Works

  2. Savita Patel

    May 24, 2014 at 10:15 am

    Working Tim it in css problem
    Mistake by Author he forget to put semi colon between text-align:center; display:none
    Change below css
    .secret {text-align:center; display:none}
    source by: http://www.bollywoodfakes.com

  3. Iskandar Dzulkarnain

    June 2, 2014 at 10:46 am

    skripnya dari kang ismet yah 😉

  4. Nabtron

    September 20, 2014 at 11:27 pm

    Thanks for the code!

    although it’s buggy but cleaned + modified it to work and also include a “close” button without sharing on one of my sites:

    will be modifying it further and make a tutorial with backlink to you on my original blog 🙂 thanks!

  5. Phạm Hữu Dư

    September 23, 2014 at 7:50 pm

    Not work, why appear hidden link even if visitor don’t like or tweet?

  6. Live Traffic Feed widget

    October 1, 2014 at 1:08 pm

    Thanks for the article very helpful, but not work, I tried this code and have a good work. you can see here

Leave a Reply

Cancel reply

Your email address will not be published. Required fields are marked *

Most Popular

To Top