Cara Membuat Tombol Share Untuk Menampilkan Link Download

Untuk Menampilkan Link Download ...  Tips Ini Sangat Sangat Berguna ... Karna Membuat Tombol/Button Share Untuk Menampilan Link Download Terlebih Dahulu Sang Pengunjung Di Wajibkan Untuk Share Artikel Kita .. Sangat Menguntungkan Bagi Kita Apalagi Saat Yang Mau Download Meng Share Artikel kita ... Semakin Banyak Share Yang Ada .. Maka Semakin Banyak Peluang Kita Untuk Mendapatkan Pengunjung Lebih Banyak ..

Lalu Bagaimana Cara Membuat Tombol/Button Share Untuk Download / Share To Unlock The Download Button .. 

Langkah Pertama Masuk Ke Template > Edit Html > Cari Script </head> ( dengan cara ctrl+f) setelah menemukan </head> taruh kode di bawah ini di atas script </head>

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

Lalu Kita Cari Kode ]]></b:skin> atau </style> Letakan Kode Di Bawah Ini Tepat Di Atas ]]></b:skin> atau </style>

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

Langkah Selanjutnya Pasang Script/Kode Button Tepat Di Atas </body>

<script type='text/javascript'>
//<![CDATA[
/* Facebook */
(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>

 
Langkah Terakhir  Buat Post Baru > Pilih HTML > Masukan kode di bawah ini
// Ubah Kode 'Link Yang Disembunyikan disini' Dengan Kode Link Kalian

<div class="secret">
Link yang disembunyikan disini</div>
</div>
<div class="secret-share">
Bagikan melalui Facebook / Twitter / Google Plus untuk melihat Link Download

<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="mafsyah" 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>

Lalu Save .. Kita Lihat Maka Hasilnya Akan Seperti Ini ...

DEMO

Berbagi :