Post Game: timer

Showing posts with label timer. Show all posts

Sunday, November 6, 2016

Cara Membuat Facebook Like Box Melayang Dengan Timer Terbaru 2015

Membuat Facebook Like Box Melayang Dengan Timer

Selamat malam, apa kabar sobat semoga baikya pada kesempatan kali ini Zerone Blog akan memberikan Tutorial Cara Membuat Facebook Like Box Melayang Dengan Timer Terbaru yang mana facebook popup like box with timer atau sering di sebut juga popup fan page with timer adalah widget yang di tujukan agar pengunjung blog sobat untuk melike fan page blog sobat sesaat loading blog dalam suatu artikel selesai dalam jangka waktu yang telah di tentukan, beberapa orang mungkin menganggap widget ini terkesan Memaksa pengunjung agar mau melike facebook dari blog tersebut.

Namun menurut saya ini wajar saja untuk menambah fan page blog selama tidak menghilangkan tombol close ya..

Ok, bagi sobat yang ingin memasang widget Facebook Like Box Melayang Dengan Timer di blog, silahkan ikuti langkah - langkah di bawah ini

Cara Membuat Facebook Like Box Melayang Dengan Timer

Mausk atau Login ke akun blogger sobat
kemudian Pilih Template > Edit HTML
Lalu Copy kan kode CSS di bawah ini tepat di atas </style>

CSS/* Likebox PopUp with Timer */
#fblikepop { background-color: #fff; display: none; position: fixed; top: 200px;position: absolute; width: 450px; border: 10px solid #6F6F6F; z-index: 200; border-radius: 9px; margin: 0pt; padding: 0pt; color: #333333; text-align: left; font-family: arial,sans-serif; font-size: 13px;}
#fblikepop body {background: #fff none repeat scroll 0%; line-height: 1; margin: 0pt; height: 100%;}
.fbflush { cursor: pointer; font-size: 11px !important; color: #FFF !important; text-decoration: none !important; border: 0 !important;}
#fblikebg { display: none; position: fixed; position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: #000000; z-index: 100;}
#fblikepop #closeable { float: right; margin: 7px 15px 0 0;}
#fblikepop h1 { background: #6D84B4 none repeat scroll 0 0; border-top: 1px solid #3B5998; border-left: 1px solid #3B5998; border-right: 1px solid #3B5998; color: #FFFFFF !important; font-size: 14px !important; font-weight: normal !important; padding: 5px !important; margin: 0 !important; font-family: &quot;Lucida Sans Unicode&quot;, &quot;Lucida Grande&quot;, sans-serif !important;}
#fblikepop #actionHolder {height: 30px;overflow: hidden;}
#fblikepop #buttonArea {background: #F2F2F2;border-top: 1px solid #CCCCCC;padding: 10px;min-height: 50px;}
#fblikepop #buttonArea a {color: #999999 !important;text-decoration: none !important;border: 0 !important;font-size: 10px !important;}
#fblikepop #buttonArea a:hover {color: #333 !important;text-decoration: none !important;border: 0 !important;}
#fblikepop #popupMessage {font-size: 12px !important;font-weight: normal !important;line-height: 22px;padding: 8px;background: #fff !important;}
#fblikepop #counter-display {float: right;font-size: 11px !important;font-weight: normal !important;margin: 5px 0 0 0;text-align: right;line-height: 16px;}

Kemudian Copy kode di bawah ini dan letakan di atas </body>

CSS<script type=text/javascript>
//<![CDATA[
 kakinetworkdotcom01username="253664224684238", //ID atau username fanpage
 kakinetworkdotcom01title="Join us at Facebook!", //Tulisan yang tampil di bar
 kakinetworkdotcom01skin="01", //Skin untuk gambar
 kakinetworkdotcom01time="50", //Mengatur berapa lama widget tampil (dalam detik)
 kakinetworkdotcom01wait="0", //Mengatu lama widget akan tampil ketika blog baru di buka
 kakinetworkdotcom01lang="en" //Kode bahasa yang digunakan widget (Indonesia = ID
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });}); //true ganti dengan false jika ingin menghilangkan tombol close
//]]>
</script>

Lalu simpan Template sobat, kemudian lihat di blog sobat apakah cara ini berhasil atau tidak

( Baca juga : Cara membuat kotak script keren di dalam postingan blog )

Demikian Cara Membuat Facebook Like Box Melayang Dengan Timer yang dapat Zerone Blog berikan semoga bermanfaat ya, Terimakasih sudah mengunjungi Zerone Blog.

Go to link Download

Cara Membuat Scroll Timer Pada Blog

Cara Membuat Scroll Timer Pada Blog - tadi karena ada yang request tentang Membuat Scroll Timer Pada Blog , kali ini saya akan mencoba untuk menjawabnya , sebetulnya sangat mudah untuk membuat Scroll Timer , hanya di butuhkan css dan javascript , Fungsi dari Scroll Timer adalah untuk mengukur jarak tinggi pada sebuah halaman blog, di homepage maupun dipostingan/laman. Scroll Timer ini mengukurnya dengan persen, dan tentu saja batas angkanya hanya mencapai 100%, selain untuk mengukur pada halaman blog, Scroll Timer ini punya keunikan, diantaranya adalah membuat blog terlihat keren, dll. Oke

Berikut Cara Membuat Scroll Timer Pada Blog :

1. Cari kode </body> . Setelah ketemu taruh kode javascript dibawa ini diatas kode </body> tersebut .

<script type=text/javascript>
//<![CDATA[
var scrollTimer = null;
$(window).scroll(function() {
 var viewportHeight = $(this).height(),
 scrollbarHeight = viewportHeight / $(document).height() * viewportHeight,
 progress = $(this).scrollTop() / ($(document).height() - viewportHeight),
 distance = progress * (viewportHeight - scrollbarHeight) + scrollbarHeight / 2 - $(#scroll).height() / 2;
 $(#scroll)
 .css(top, distance)
 .text( ( + Math.round(progress * 100) + %))
 .fadeIn(100);
 if (scrollTimer !== null) {
 clearTimeout(scrollTimer);
 }
 scrollTimer = setTimeout(function() {
 $(#scroll).fadeOut();
 }, 1500);
});
//]]>
</script>

2. Langkah terkahir Pasang CSS-nya ( pasang kode dibawah ini diatas kode ]]></b:skin> )

#scroll {
 display:none;
 position:fixed;
 top:0;
 right:20px;
 z-index:500;
 padding:3px 8px;
 background-color:#2187e7;
 color:#fff;
 border-radius:3px;
}

#scroll:after {
 content:"";
 position:absolute;
 top:50%;
 right:-8px;
 height:0;
 width:0;
 margin-top:-4px;
 border:4px solid transparent;
 border-left-color:#2187e7;
}

Note :
Kode yang berwarna Kuning merupakan kode warna scroll timer, Anda bisa ganti dengan kode warna sesuai keinginan. ( oh ya untuk demo anda bisa lihat di samping kanan scrollbar blog saya )

Go to link Download

Sunday, November 6, 2016

Cara Membuat Facebook Like Box Melayang Dengan Timer Terbaru 2015

Cara Membuat Facebook Like Box Melayang Dengan Timer Terbaru 2015

Membuat Facebook Like Box Melayang Dengan Timer

Cara Membuat Facebook Like Box Melayang Dengan Timer

Sunday, October 9, 2016

Cara Membuat Scroll Timer Pada Blog

Cara Membuat Scroll Timer Pada Blog