Membuat Konten Sosial Locker di Blogger BlogSpot

Published by Kang Fathur Tuesday, February 11, 2014

Haloo para Sobat Blogger semua, setelah kurang lebih setahun tidak Ngeblog karena aktivitas lain, minggu-minggu ini saya baru ngeblog lagi sekaligus mengganti Template yang katanya Responshive, Ok langsung aja kepermasalahan.

Berapa banyak orang yang menggunakan situs jaringan sosial untuk meningkatkan Traffic Website mereka ? Ada Blogger profesional yang sepenuhnya tergantung pada Lalu Lintas Sosial . Namun, sangat sulit untuk mendapatkan eksposur sosial dengan cepat . Padahal , ada beberapa widget yang membantu untuk meningkatkan pengikut sosial , tetapi tidak cukup . Jika kita ingin mendominasi web sosial , maka kita harus memanfaatkan setiap kesempatan yang kita miliki.

Di bawah ini Locker Sosial terdiri dari tiga tombol sosial dan loker menampilkan horizontal. Tombol Sosial terdiri dari Facebook, Twitter dan Google plus. Setiap seseorang yang akan melihat Link atau Gambar atau apasaja yang kita sembunyikan didalamnya harus mengklik salah satu tombol share yang tiga tersebut. Kebanyakan orang biasanya trik ini digunakan untuk menyembunyikan Link Download.

Untuk lebih jelasnya di bawah ini adalah demonya, silahkan sobat share ke salah satu jejaring sosial.

Tertarik setelah melihatnya??

OK Kalau tertarik mari kita langsung ke langkah-langkakh pembuatannya :

• LogIn ke Blogger.com >> Template >> Edit HTML

• Kemudian cari kode </head> kalau sudah ketemu simpan kode dibawah ini di atas kode </head> :

<link href='https://googledrive.com/host/0B0aY4MdP5ycaQkVTTlVIWV9VNDQ' rel='stylesheet' type='text/css'/>

Kalau sudah klik Simpan Template.

Sekarang kita ke cara Pemasangan Konten Sosial Locker nya: Setiap sobat mau menambahkan Konten Sosial Locker ini kesetiap Postingan cukup menjalankan perintah di bawah ini, artinya tidak perlu lagi dari langkah-langkah di atas.

• Caranya pergi ke Blogger.com >> Entri Baru. (News Post)

• Blok kode di bawah ini dan paste di Postingan sobat.

<article id="default-usage">
<div class="to-lock" style="display: none;">
 <div style="text-align: center; margin-bottom: 20px;">
<img src="Add_Hidden_Image_Here" alt="" style="margin: auto;" />
</div>
<!--Hidden Content Ends (You can Use HTML ABOVE)-->
</article>
</div><div id="mblunlocker"> </div>
<script type="text/javascript" src="https://googledrive.com/host/0B0aY4MdP5ycaaUIyQkF3U1dUcms"></script>

<script>
jQuery(document).ready(function ($) {
$("#default-usage .to-lock").socialLock({

text: {
header: "Silahkan Share Untuk MEmbuka Linknya",
message: "Yes, this is Social Locker. Just try it, click on one of buttons."
},

style: "ui-social-locker-secrets",
buttons: {
order: ["twitter", "facebook", "google"]
},

// twitter options
twitter: {
url: "http://ade-tea.blogspot.com",
text: "Membuat Konten Sosial Locker di Blogger"
},

// facebook options
facebook: {
url: "https://www.facebook.com/",
appId: "107710485966311"
},

google: {
url: "http://ade-tea.blogspot.com"
}
});
});;;;
</script>

KETERANGAN :
Untuk Facebook : ganti https://www.facebook.com/ dengan Page Facebook sobat beserta appId Facebook sobat.
 Untuk Twitter : ganti http://ade-tea.blogspot.com dengan Alamat Blog Sobat beserta kata-kata yang akan dimasukannya
Untuk Google+ : Ganti http://ade-tea.blogspot.com dengan Alamat Blog Sobat.
Terakhir kode yang Berstabilo Merah ganti dengan Link Download, Gambar atau Teks yang akan sobat sembunyiakn.

Jika semua sudah selesai. Silahkan Publikasikan postingan sobat dan lihat hasilnya.

Semoga artikel ini dapat bermanfaat. Wassalam

Sumber : http://www.mybloggerlab.com/