Show Download link or button after share or like on social media button for blogger blog

Download button will be shown after clicked or shared post using social media buttons are Facebook, twitter or google+. This post must be very useful for social media strategy in SEO (Search Engine optimization). For that you have to add some JavaScript, Style for like button and Download button in step by step in easy way.

Useful: Best SEO (Search Engine Optimization) techniques for blog and website

Now a day Download option after share or like social media tricks is very handy and effective for startup blogger who has no traffic and Pageviews, Low SEO score blog and website. At the end you should increase social media page likes, friends on fane page.

Show Download link or button after share or like on social media button step 1

Steps for Download link after shared or liked social media button (Facebook, Twitter and Google+)

Step 1:
Go blogger template > Template > edit HTML.

Step 2:
Add below jquery tag link in framework given in below. This java script hide Facebook social media buttons after clicked on it.

Put below line just above </head> tag.

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

Step 3:
Put below CSS lines code put above the “]]></b:template-skin>” or “]]></b:skin>” tag.

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

Sep 4:
Copy the below code above the </body> tag

<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>

Step 5:
When you weighting the post you have to add the below code your download link add first tag of below code which is display after click or share on social media button.

<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>

After that publish your post. Your post looks like in below screen:

Show Download link or button after share or like on social media button

Don’t miss to read our useful article on SEO, Blogging, Tips and Tricks and How to Guide.

Other search for this post:
Get direct download link after share on social media for blogger.
Share and Download option in blogger blog
How to increase fans on download link: SEO strategy.

Don’t miss to share such a help full post for other bloggers and friends. Feel free and comment in below to get assist you in any problem.