Share to Unlock The Download Button, mungkin sobat sering menemukan kata-kata seperti itu. Artinya link download akan muncul setelah klik Like Facebook / Tweet atau Merekomendasikan di Google Plus. Link yang disembunyikan biasanya link premium. Sangat wajar, sebuah link download ditukar dengan like, tweet atau recomend on Google+.lock

Lebih konkritnya tampilannya seperti gambar di bawah ini :

share to unlock download link


Untuk melihat efeknya, silahkan klik tombol 'Demo' diatas kemudian scroll kebawah dan sobat bagikan di salah satu sosmed yang ada baik Facebook, Twitter atau Google Plus.

Trik seperti ini sangat berguna untuk memperkuat posisi blog sobat di SERP, karena berbagi ke jejaring sosial merupakan salah satu Optimasi SEO. Bagi sobat yang ingin menerapkan cara ini, silahkan sobat fahami baik-baik langkahnya :

Pemasangan Kode / Script


Langkah 1 : 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 2 : Pasang Kode CSS di atas ]]></b:skin> atau </style>

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

Langkah 3 : Pasang Script Penampil Button 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>

Apabila pada template sobat sudah ada kode yang mirip-mirip seperti itu, silahkan hapus dan ganti dengan kode di atas. Jangan lupa untuk membackup dulu template.


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

Semoga bermanfaat bagi sobat yang ingin memunculkan link download setelah share.

Resource : http://www.makeuseof.com/tag/make-your-own-tweetlike1-to-unlock-system-with-jquery/

162 komentar

mantab bang keren keren keren ajib deh

Balas

Brother its really awesome Tool

Regard
LovelyTricks.CoM

Balas

oke.. makasih semuanya :D

Balas

Wantaff kang, izin comot ahh :D

Balas

Titip Link lagi tuh orang :D

Balas

ijin copy script dan mencobanya boss....

Balas

iya kang cara ini cukup ampuh biar postingannya di share , saya pernah nerapin juga di blog yang lain :) thanks kang.

Balas

bagus kang, mirip dengan share locker yang dijual di themeforest

Balas

sama2 sob.. mantep dong :D

Balas

themeforest itu bukannya khusus theme/template? biasanya kalau per-kode-an adanya di codecanyon :D

Balas

:ngakak: ini nama nya pemaksaan kang.. haha :ngakak:

Balas

pertukaran.. bukan pemaksaan, yang maksa itu yang popup nya lama :ngakak:

Balas

mantep nih kang, ijin mencobanya :D

Balas

keren bgt, tadinya sudah ngantuk tapi pas liat postingan ini jd semangat kembali :D

Balas

haha,. aya-aya wae kang ismet ma, trik cara pemaksaan like nya kang,. :ngakak:

Balas

trik yang baik untuk SEO, mantap

Balas

betul, apalagi kalau pop-up nya gak ada tombol closenya :D

Balas

Matap kang....Pantas di coba...
^_^ |o| -bd

Balas

pake plus one gak muncul kang link donlot nya kenapa dan kunaon yah ? :(

Balas

haha iya , di codecanyon / tympanus.! dan yang jelas kalo pengen yang gratisan + full versi indonesia mending di BLOG KI aja gan :-bd

Balas

^_^ ini mah kang gw tunggu tunggu yang kang ismet posting.... |o|
tapi kang =( . tombol g+ nya gak berfungsi tuh kang. :P
yang berfungsi cuman FB da twitter nya doank kang. @@,

Balas

di themeforest bukan hanya template doank kang. ^_^
lihat aja kang dimenu nya kang. =D si alief mungkin gak perhatiin di menu nya codecanyon termasuk dalam perkumpulan themeforest juga kang :-bd , dan masih banyak lagi yang termasuk dalam perkumpulan mereka kang. :ngakak:

Balas

waduh sudah tertinggal beberapa puteran nih kang ... ah da eta sibuk ngala lauk saya teh .. betul kata yg komentar ini trik pemaksaan hehe

Balas

@kang ismet.. haha gitu ya kang, :ngakak:

Balas

hihi akhir na aya anu satuju oge. hehe lol
sip kang Ruly.. hehe

Balas

apa di blog demo ada crash atau gimana yah.. puyeng saya juga, disini normal :
http://yourjquery.url.ph/test.html

Balas

cek ini kang : http://yourjquery.url.ph/test.html

Balas

iya sih.. tepatnya emang codecanyon, karena codecanyon dan themeforest masih di group Envato

Balas

daripada popup mending maksa kaya gini :D

Balas

hahaha daripada clonning, mending makasa share :ngakak:

Balas

Kang barusan di coba, pakai FB sama G+ ga jalan, hanya pakai twitter aja yang jalan :D

Balas

iya kang , kalo d yourjquery itu support . hhe , saya tunggu pencerahan selanjutnya .. terima kasih kang ismet :D

Balas

aih geuning eta rai raka si codecanyon sareng themeforest teh nyak? nembe terang simkuring kang .. @@,

Balas

kalo di saya cuman fb & twitter nya aja yang jalan kang adi . :D

Balas
Komentar ini telah dihapus oleh pengarang.

kang , di share template droiddplus nya...keren

Balas

hihi mau banget yahh?? :D , iya kang share dong keren banget tuh droid plus nya .. wkwkw

Balas

bagus tutorial. boleh dibookmark dulu...

off topik. www.bloggertut.com sudah tidak aktif . ada link alternatif untuk buka blog itu? TQ

Balas

Menyelam sambil minum kopi nih Kang,,,, tingal ongkang-ongkan doang artikel sudah banyak yang share :)
Mantap kang |o|

Balas

Menambah wawasan baru kang, makasih sebelumnya.. ^_^

Balas

nah ini, maksa banget minta di like :D .

Balas

Cara naruhnya di template magzfil gimana yah? Bingung neh kang hehe :D

Balas

memang mantep trik2 yang dishare kang ismet niy :-bd

Balas

sama aja ko sob... intinya perhatikan posisi peletakan kodenya

Balas

wkwkkwkw... bukan maksa, barter :D

Balas

hehehe... tiduran sambil minum susu :D

Balas

Atuh ampar-amaparan kamana mana susuna Kang kalo sambil tiduran mah :ngakak:

Balas

Cocok nih caranya buat timbal balik nunggu proses upload. Good job kang =D

Balas

kang ismet maaf ya komentarnya post disini !|o|
kang ismet kok widget back to topnya gak valid html 5 ya !:(
sedangkan blog agan valid html 5 !=D
coba share back to top tapi pake demo(jangan di blog ini) dan valid html 5!=(
sekian

Balas

Ini dia yang saya cari-cari :D
Terimakasih kang..

Balas

mantap sekali kang tipsnya. harus dipraktekan ini, secara banyak fitur download diblog saya. makasih banyak kang, menambha ilmu lagi. :D

Balas

coba ke sini http://blog.kangismet.net/2013/09/membuat-tombol-back-to-top-dengan-efek-bounce.html

Balas

maaf kang tambahan komentar satu lagi, trik ini masih mudah sekali diakali karena kode ini masih terlihat jelas di inspect element.

<div class="secret">

<div class="button-group" style="text-align:center">
<a class="newbutton download" rel="nofollow" href="https://drive.google.com/uc?export=download&confirm=no_antivirus&id=0B5E6uBjFyBQhTFZIRmpVM0ZTY00">

Download

</a>
</div>

</div>


klo boleh kasih saran class="secret" ini dihiden dulu pake js kang. dan setelah di klik like atau share baru ditampilkan.
mohon tutornya. :D

Balas

betul juga ya.. baru kepikiran, coba nanti saya cari solusi

Balas

ditunggu ya kang updatenya. :D

Balas

wah keren kang, penemuan baru lagi nih @@, wow super2 mantab

*salam damai

Balas

Kang saya mau tanya, apakah ini aman?
sebab saya pernah pake kayak beginian dengan memakain tutorial dari luar, 60 detik kemudian malah ke direct ke web lain, ditunggu jawabannya :)

Balas

aman.. ini tidak ada scriptredirectionnya.. dijamin :D

Balas

nu make trik ieu mah teu niat mere weh, make acara kudu share/like/plus sagala patut...bukhiqixixixi :D

Balas

mere.. ngan teu ikhlas heuheu

Balas

naon ceunah ieu teh ngutruk caritana teh kang beben? nyebut kang nyebuutt but butt ..

Balas

mantap kang,selain artikel kita jadi di shre...nambah deh pengunjungnya :D

Balas

betul mas, pdhl sy mau belajar disitu

Balas

waduh.. pas banget, kang. makasih. coba saya aplikasi ke blog. Hihi :)

Balas

eh ya codecanyon, gara gara akun envato dibanned jadi lupa, padahal dah beli lebih dari 5 :(

Balas

Sudah lama tidak online nih, dan akhirnya mampir juga kemari.
Artikelna raos keneh kang :)

Balas

sy sudah menerapakannya di blog sy kok gini mas ini linknya http://allterbaru-ashock.blogspot.com/2014/01/metro-notifications-v67-apk.html

Balas

Kalau gitu, yuk kita jalan bareng

Balas

Menarik Kang artikelnya saya coba dulu nih :ngakak:

Balas

bagaimana caranya untuk mengganti dari share ke follow this blog,
mohon jawabannya kang

Balas

Aduh gagal :( apa jquery harus vers 1.10.2

Balas

Mungkin iya, mungkin anda harus pasang 2 jquerry, lalu anda gunakan javascript jquerry no conflict, tapi karena ada 2 jquerry , loading jadi korban

Balas

maksa ieu mah euy rek mere teh nya, sok lah nyimak heula we abdi mah, bade ctrl+d hela bsi we ke blog abdi aya dongdot2an, ari ayena mah apanan teu acan aya :)

Balas

wah trik trik kang ismet ga ad matinya... mantaf kang... ijin sedot...

Balas

Keren triknya, super sekali :D

Balas

Maaf kang, saya cuma tau.

.secret {text-align:centerdisplay:none} kurang kang, seharusnya
.secret {text-align:center; display:none}

semoga membantu. salam penggemar blog kang ismet dari. blog.kangfand. hehe :D
CMIIW

Balas

Hadeehh kang, sudah dicoba semua tutorial diatas tapi kok malah gini kang @@,
http://prntscr.com/2p5pil

Balas

seperti Like to Download tapi lebih samar n lebih keren..

Balas

keren gan template nya izin download ya :-d

Balas

Wa hampura ngiring Oot, upami pasang "meta content keyword" anu valid html5 kumaha nya. Punten pisan da bageur. :D

Balas

:ngakak: hahahahaa
makanya kang.... :D
apa lagi saya.... makin bingung kang.... @@,
dari script nya sih pas pas saja... tapi saat pemasangan , kok jadi gitu yahh :(
hadeh.....

Balas

:ngakak: kira kira gitu deh kang.

Balas

:ngakak: hahaha alayyy
anak zaman =D

Balas

komentar ke 100 dulu ah lol

Balas

sudah saya terapkan bos
terima kasih!

ximplify.blogspot.com

Balas

ubah

.secret {text-align:centerdisplay:none}

ke

.secret {text-align:center;display:none}

Balas

Kalo di intregasikan dengan sharethis button bs kah kak ?

Balas

Kang, Dengar-Dengar mau Bagi Template :)
Kasih Bocoran Soal Template yang mau dibagi donk ^_^

Balas

Manteppp nih kang tutor nya :D ...

Balas

Tapi kalo org awam pasti gak bakal CTRL + U =D

Balas

betul mas anwar, akan tetapi para downloader itu ada aja otaknya. :D
site sekelas sharecash aja dikelabui juga. hehhehe

Balas

Tentu saja bisa mbak, tidak perlu memasukkan script like ke dalam posting HTML. Yang penting jangan lupa memberi tahu visitor untuk like dulu agar link download keluar :)

Sudah saya buktikan.hehe

Balas

@iril: coba tanya langsung ke MZ HomeShop cara penggunaannya

Balas

maksih kang,, izin pakaiii..
kal dipakai buat donlod2 lendir gmn yah???
:D

Balas

kok disaya gak bisa ya om ? link nya malahan di atas kotak itu :(

Balas

dicek posisi penempatan kode / scriptnya bro .....

Balas

makasih kang kismet, membantu sekali

Balas

Kang.... bade Naros,,,,
lamun nu tos ngalike nu follow,,terus tos download hiji file ,,,,,

ke di lain posting otomatis like fb, follow twiter na,,,,,, tos ka like sareng ka follow,,, ke te tiaasa download deui soalna like sareng follow tos di lakukeun di file nu sateacanan,,,,, tah eta solusina kumaha kang ?

Balas

Kang Kenapa Saya Punya Jadi Begini ..?
padahal udah ngikutin tutorialnya =(
http://6juni2000.blogspot.com/2014/02/droidpluss-responsive-blogger-template.html
mohon sarannya Okkk :-bd

Balas

trik jitu ini mantap! nah gimana kalo "comment first to unlock download button" seru jg tuh kyknya :D

Balas

kang kalau naruh kode css nya dimana kalau dah pakai css reset ?

maaf gak baca komen sebelumnya jika pertanyaan ini sudah ada sebelumnya

Balas

kok ane gk bisa yah ?
ane pke template yg droid padahal ..
bisa bantu ?

Balas

Di coba lagi satu persatu, jangan lupa dilihat ada berapa Jquery di blog agan. hehe

Balas

sudah semuanya mas :( bingung saya >.<

Balas

Mungkin Jquery nya kebanyakan, atau penempatannya di ubah aja.

Balas

Jquery cuman satu kok mas , di ubah ? digimanain tuh ?

Balas

CSS nya dicheck lagi gan !
harusnya seperti ini
.secret {text-align:center;display:none}
.secret-share {padding:20px;text-align:center;border:3px solid #ddd}

Balas

Keren Kang tutor ya


Salam damai
http://gpc-blog.blogspot.com/

Balas

meletakan link downloadnya di bagian mana ya kang ?? maaf newbie :)

Balas

ada kesalahan di CSS nya tuh mas , Perbaiki

Balas

haha.. ijin pake scriptnya kang.. lol

Balas

Kang... kalo ane pengen cuman Like FB doank yang tampil, ga pake GoogleShare ato twitter. caranya gimana ya...?

Balas

Mas link downloadnya udah tertutup, tapi setelah ane klik like gabisa trs share/google+ jg ga bisa muncul linknya gmn solusinya?

Balas

kang ko di blog saya ga bisa ya ?
setelah di share, malah ga muncul link downloadnya .. bagaimana solusinya ?
Terima kasih ..

Balas

Kang izin ngshare di blog ku ya hehehe :D
http://sharexid.blogspot.com/2014/03/share-to-unlock-download-button.html

Balas

Jadi seneng netan nih,, pa lg lo mampir ke blognya kang ismet, senang senang senang

Balas

kang ismet bikinin tutorial cara membuat social locker dong :]

Balas

kang request cara buat content locker dong :]

Balas

makasih tutorialnya kang.. sangat berguna

Balas

kang ko saya tidak bisa yah, link'a tetep muncul

Balas

saya nyoba gagal bae kang,, apa yang salah yah

Balas

Ijin pke scriptnya kang :D Sukses terus :-d

Balas

makasih infonya, salam kenal :)

Balas

disini aja gan.... http://blog-agri.blogspot.com/2014/05/test.html

Balas

kok gagal ya kang??? udah dipasang tapi linknya g didalam,tapi malah diatasnya tombol like n sharenya, pencerahannya kang.

Balas

Mantap Artikelnya Sangat Bermanfaat Kunjungi Blog Ini ya http://ornoxlous.blogspot.com/ thank (y)

Balas

@ KontesSEOBetKlik99 Menangkan Total Hadiah HINGGA 36Juta Rupiah!

Silahkan Daftar disini: http://kontesseobetklik99.com

DAPATKAN @Rp 100.000,- bagi 50 Pendaftar Yang Melakukan Pendaftaran. Sebelum 30 Juni 2014

@ Total Hadiah: 36 Juta dengan rincian:

• Pemenang 1: Rp 10.000.000
• Pemenang 2: Rp 7.500.000
• Pemenang 3: Rp 5.000.000
• Pemenang 4: Rp 2.000.000
• Pemenang 5: Rp 1.000.000
• Pemenang 6-10: Rp 500.000
• Pemenang 11-20: Rp 200.000
• Pemenang 21-30: Rp 100.000

Balas

kang, kalau like nya di ganti follow blog bisa kaga ?? :)
jadi bukan like untuk membukanya tapi follow blog kita

Balas

keren banget kang tutorialnya :D mau izin pasang diblog ane kang :D

Balas

Gan, ini supaya yang di likenya fanpage fesbuk saya gimana caranya "? di sana ga ada tlsn buat masukin alamat facebook gw gan

Balas

Keren artikelnya kang. Visit back ya www.urrofiblog.blogspot.com

Balas
Komentar ini telah dihapus oleh pengarang.

Ini yang aku cari, bermanfaat sekali buat menambah trafik blog dan pengikut blog ya kan! Thanks kang!

ditunggu kunjungan baliknya: www.saputramz.com

Balas

punyaku kgak ke hiden bang :P

Balas

ko ga muncul juga yah di blog?? :(

Balas

klo di share di google+ koq gak mau kebuka yah?
(siomponk.com)

Balas

Poskan Komentar


×
Chat