Berapa banyak anda telah mendapatkan Traffik dari situs jejaring sosial? Ada banyak Blogger atau web master yang mendapatkan traffik besar dari situs sosial karena sekarang situs jejaring ini merupakan sumber penting untuk mendapatkan traffik dan hampir setiap pengguna internet menggunakan situs sosial. Nah, mari kita menuju ke postingan hari ini yaitu tentang memunculkan kotak "Share To Enter". Kotak ini merupakan kotak pop up, yang akan pertama kali muncul saat web terbuka. Kotak pop up ini benar-benar fantastis dalam mendapatkan lalu lintas dari situs sosial karena ketika seseorang akan masuk ke blog / situs, kotak pop up ini akan muncul dan pengguna harus klik pada tombol sosial untuk mengakses situs Anda. Kotak pop up ini dibangun dengan 3 tombol situs sosial utama yaitu Tombol Like Facebook, tombol tweet dari Twitter dan tombol Google+ plus one. Jadi Intinya pengunjung harus tekan tombol share dulu agar blog kita terbuka. Memang agak memaksa, tapi itu terserah anda
Some Great Features Of This Pop Up Box
- Widget ini memiliki tombol close sehingga pengunjung dapat mengacuhkannya. Tetapi anda juga dapat menghilangkan tombol close tersebut, Sehingga pengunjung tidak dapat menclosenya dan harus menekan share terlebih dahulu.
- Widget ini berfungsi diberbagai macam browser dan menggunakan desain sederhana dan rapi
- Ada tiga macam tombol share seperti Facebook Like, Tweet dan Google Plus one.
- Orang yang sudah berbagi akan mendapatkan cookie (history) sehingga jika ia datang lain waktu dengan akun yang sama, widget ini tidak akan muncul.
- Widget Ini hanya akan muncul bagi pengunjung yang tidak mengikuti Anda pada situs web sosial, tetapi jika mereka mulai mengikuti maka widget ini akan berhenti muncul kepada mereka.
Add Share To Enter Pop Up Box In Blogger
Pemasangannya cukup mudah, anda hanya cukup membuat widget baru dan menyimpan script enter pop up widgetnya. Berikut tutorial lengkapnya.. :
- Go To Blogger >> Layout >> Add a Gadget
- Choose HTML/JavaScript
- Paste The Following Code In The Content Box and Leave The Title Empty.
<style>
.blackout {
display: none;
position:fixed;
_position:absolute;
width: 100%;
z-index:10000;
background-color:#000;
margin: 0px;
padding: 0px;
left:0;
top:0;
}
.socialmodalOuter {
display: none;
font-family: arial;
color: #575E6D;
font-size: 14px;
line-height: 20px;
background: rgb(73, 73, 73); /* The Fallback */
background: rgba(0, 0, 0, 0.6);
border-radius: 10px;
left: 50%;
padding: 7px;
position: fixed;
_position:absolute;
top: 50%;
z-index: 10001;
}
.socialmodal {
background: none repeat scroll 0 0 #FFFFFF;
border-radius: 3px 3px 3px 3px;
width: 460px;
}
.socialmodal .title {
border-bottom: 1px solid #E5E8EF;
font-weight: bold;
font-size: 19px;
font-weight: bold;
padding:16px 15px 10px 15px;
text-align:center;
}
.socialmodal .subtitle {
margin: 0px;
background:#2e6886;
color:#ffffff;
padding:4px;
text-align:center;
font-weight: bold;
font-size: 15px;
}
.socialmodal .warning {
margin: 0px;
background:#cb2026;
color:#ffffff;
padding:4px;
text-align:center;
}
.socialmodal .content {
padding: 0px 15px;
margin-top: 10px;
line-height: 17px;
}
.socialmodal .share {
padding: 0px 15px;
margin:20px 0px 15px 0px;
text-align:center;
height: 24px;
}
.socialmodal .close {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiFOiipxf-M-Bz-kyGJG8epRW_eoAMK9x_yVSV6WoSEh5wQIJbOFQqUx2xuYMmAZ3uzODiQSyDg3oa_d2Lz6NFDIDE9hk3zqlK2D_K00V5vOEulQPhEf3S3Ecx3CrK7UVBCXXCltfqIQI/s1600/close.png") no-repeat;
cursor: pointer;
height: 12px;
position: absolute;
right: 15px;
top: 15px;
width: 12px;
display: none;
}
.socialmodal .button {
float: left;
width: 115px;
line-height: 24px;
height: 24px;
}
.socialmodal .like {
margin-left: 15px;
}
.socialmodal .twttr {
margin-left: 30px;
}
.socialmodal .plus {
width: 90px;
margin-left: 50px;
}
/*
// cusomize position of elements
*/
.socialmodal .footer {
clear: both;
background: none repeat scroll 0 0 #E8EAEF;
border-radius: 0 0 3px 3px;
border-top: 1px solid #DDE0E8;
padding: 10px 0;
color: #878D9C;
text-shadow: 0 1px 0 #FFFFFF;
text-align:center;
font-size:13px;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
!window.jQuery && document.write('<script src="js/jquery.js"><\/script>')
</script>
<script src="http://apis.google.com/js/plusone.js" type="text/javascript" gapi_processed="true"></script>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1" type="text/javascript"></script>
<script src="http://platform.twitter.com/widgets.js"></script>
<script src="http://mitstyle.googlecode.com/files/share%20to%20enter%20box.js" type="text/javascript"></script>
<script src="http://mybloggerlab.com/Scripts/jquery.cookie.js" type="text/javascript"></script>
<script language="javascript">
$(function() {
$('body').socialmodal({
subtitle: 'Like And +1 to Disable This Notification',
facebook: 'http://www.facebook.com/ujangyoyosite',
plusone: 'http://ujangyoyo.blogspot.com/',
count: 0,
manualClose: true,
});
$('body').socialmodal({
twitter: 'ujangyoyo',
onclick: '#download',
callback: function(success) {
},
});
});</script>
- Ganti http://www.facebook.com/ujangyoyo dengan Url fanspage Facebook anda.
- Ganti http://ujangyoyo.blogspot.com/ dengan url blog anda.
- Ganti ujangyoyo dengan username twitter anda.
- Jika anda ingin menghilangkan tombol close, maka hapus kode berwarna merah
- Finally Click Save and You Have Done!
Last Words
Bagaimana? sangat mudah sekali bukan? Jadi kesimpulannya, semoga widget ini akan membantu Anda untuk meningkatkan pengikut sosial Anda dan widget ini dibuat oleh mybloggerlab.com. Jika Anda memiliki pertanyaan maka beritahu saya di komentar. Sekian post tentang Cara membuat pop up share to enter (sharing paksa). Jangan lupa membaca post saya yang lainnya dengan membaca DAFTAR ISI. Maaf bila ada salah-salah kata, semoga tulisan ini dapat bermanfaat bagi anda. Tetap terhubung dengan Ujangyoyo karena akan ada postingan baru yang lebih menarik. Happy Blogging friends!
AD-BLOCKER DETECTED!
