Cara Membuat Tombol Share to Unlock Download

Langkah pertama: Pasang Framework jQuery.

Untuk memunculkan dan menyembunyikan objek, diperlukan sentuhan jQuery. Oleh karena itu silahkan pasang kode ini di atas </head>

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

Pemasangan jQuery pada template cukup 1 saja. Apabila ada beberapa versi framework jQuery, maka efek-efek tidak akan berjalan.

Langkah kedua: Pasang Kode CSS di atas ]]></b:skin> atau </style>

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

Langkah ketiga: Pasang Script Penampil Button di atas </body> atau di atas </head>
 

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

Penulisan pada Postingan

Untuk memunculkan tombol Like, Tweet atau Google Plus dan juga objek (link download) maka format penulisan pada postingan seperti ini (tulis pada mode HTML bukan Comopose) :

<div class="secret">
Letakan kode atau link yang akan kamu sembunyikan disini
</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="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>