Pada postingan terdahulu pernah saya bahas tentang "Cara Membuat Share to Unlock The Download Button ", kali ini pun saya akan membahas kembali yang intinya sama, tetapi beda hasilnya seperti contoh pada gambar diatas. Icon yang terlihat lebih besar dan mirip dengan plugin pada wordpress.
Artikel ini saya temukan dari website gagapseo.com. sebelum saya share kembali di blog ini, terlebih dahulu saya mencobanya dahulu untuk saya terapkan di blog ini dan hasilnya pun bisa di lihat di link demo di bawah.
Sudah selayaknya anda [ para blogger ] mendapatkan imbalan dengan content yang anda berikan dengan cara meng-like atau men-share artikel anda ke situs media sosial yang sudah disediakan. Tentunya anda akan untung pula dengan menggunakan sistem ini.

Untuk melihat hasilnya, anda bisa menuju halaman DEMO berikut ini
Adapun cara membuatnya adalah sebagai berikut:
1. Menuju template anda, kemudian Edit HTML
2. Letakkan kode berikut ini DIBAWAH kode <head>
<script src='http://code.jquery.com/jquery-1.10.2.min.js' type='text/javascript'/>
3. Jika di template anda sudah ada kode yang sejenis dengan diatas, anda tidak perlu memasangnya kembali.
4. Letakkan kode berikut ini DIATAS kode </head>
KETERANGAN:<link href='https://sites.google.com/site/menightfury/home/social-locker/public/sociallocker_v1.6.0.css' rel='stylesheet'/>
<script src='https://sites.google.com/site/menightfury/home/social-locker/public/sociallockermin_v1.6.0.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function ($) {
$('#default-usage .to-lock').sociallocker({
buttons: {order:["facebook-like","twitter-tweet","google-plus"]},
twitter: {url:"http://twitter.com/imherry"},
facebook: {url:"https://www.facebook.com/SiomponkNetwork"},
google: {url:"https://plus.google.com/+HerryRachman-OK"},
text: {
header: "Like us To Unlock This Content",
message: "This content is locked. Like us on Twitter, Facebook or Google plus to unlock it."
},
locker: {close: false, timer: 0,},
theme: "secrets"
});
});
//]]>
</script>
http://twitter.com/imherry = ganti dengan twitter anda
https://www.facebook.com/SiomponkNetwork = ganti dengan facebook anda
https://plus.google.com/+HerryRachman-OK = ganti dengan Google+ anda
5. Simpan template anda.
Kemudian adapun pemasangan pada postingan, anda bisa meletakkan kode berikut ini pada postingan anda.
<article id="default-usage">
<div class="to-lock" style="display:none;">
-- Content yang disembunyikan --
</div>
</article>
Nah, demikianlah postingan saya kali ini tentang Membuat Social Content Locker Untuk Blogger dan semoga dapat bermanfaat untuk anda.
Salam Blogger...
0 komentar:
Post a Comment