/ / / Membuat Widget Facebook Like Box dengan Popup

Membuat Widget Facebook Like Box dengan Popup

Membuat Widget Facebook Like Box dengan Popup | Blog Menawan - Untuk postingan hari ini, Blog Menawan sudah membuat dan menyiapkan artikel terbaru, yang mungkin dapat bermanfaat bagi pengunjung Blog Menawan yang sedang mencari solusi dan menemukan artikel dengan judul Membuat Widget Facebook Like Box dengan Popup di google pencarian.

Jika sebelumnya atau kata kunci yang sedang ramai untuk Blog Menawan adalah download theme miui , themes MIUI V8, theme MIUI V9, theme MIUI V10 , download intagram mod , how to flash firmware 100% work , stock rom and flashing, how to root android device, tutorial android, download drivers android, cara flash via fastboot, flashtool, custom rom trwp, download system.img, recovery.img, fashboot.img, cara mengatasi bootloop tanpa pc, install without pc, and etc . . Maka untuk saat ini atau artikel yang saya beri judul Membuat Widget Facebook Like Box dengan Popup belum menemukan solusi anda, maka bisa ikuti link berikut membaca artikel menarik lainnya yang mungkin kamu butuhkan Artikel, Blogger, kamu bisa menemukan banyak artikel yang terkait dengan Membuat Widget Facebook Like Box dengan Popup. Lanjutkan ke pembahasan dan baca ya hingga akhir..

Author Picks

Membuat Widget Facebook Like Box dengan Popup


Cara Membuat Widget Facebook Like Box dengan Popup - Hallo ! Di artikel kali ini saya akan membahas tentang tutorial membuat Widget Facebook Like Box Popup di Blogger. Sebelumnya saya mohon maaf, akhir-akhir ini saya sangat sibuk di dunia nyata sehingga saya jarang membuat artikel / postingan di blog ini, tetapi saya akan usahakan tetap membuat artikel walaupun jarangan karena kesibukan saya.

Kembali ke topik pembicaraan kita, Widget Facebook Like Box Popup ini saya dapatkan dari blog Kompi Ajaib saat saya sedang mencari refernsi atau tutorial seputar blogger yang dapat saya bagikan (share) kembali kepada kalian.

Jika kalian penasaran, silahkan kalian coba dan praktekan saja langsung. Caranya cukup mudah, kalian hanya cukup ikuti saja langkah-langkah dibawah ini :

blogmenawan.blogspot.com | Membuat Widget Facebook Like Box dengan Popup di Blogger

Membuat Widget Facebook Like Box Popup di Blog
1. Buka dan masuk ke Blogger.
2. Pada dashboard blogger, anda klik Template > Edit HTML.
3. Cari kode </body>.
4. Lalu Copy Paste kode dibawah ini, dan taruh sebelum kode </body>.
<script>
//<![CDATA[
  var appended = false,
  bookmark = document.createElement("div");
  bookmark.id = "fbOnscroll";
  bookmark.innerHTML = '<div class="fbbox-wrapper zoomInUp">
  <iframe name="f13bea94f064144" width="1000px" height="1000px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="Images By Blog Menawan - fb:page Facebook Social Plugin" src="https://www.facebook.com/v2.7/plugins/page.php?adapt_container_width=true&amp;app_id=113869198637480&amp;channel=https%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter%2Fr%2FuN4_cXtJDGb.js%3Fversion%3D42%23cb%3Df19b772d4d20444%26domain%3Ddevelopers.facebook.com%26origin%3Dhttps%253A%252F%252Fdevelopers.facebook.com%252Ff1ba7fe51c4d354%26relation%3Dparent.parent&amp;container_width=613&amp;hide_cover=false&amp;href=https%3A%2F%2Fwww.facebook.com%2FKangKudet&amp;locale=en_US&amp;sdk=joey&amp;show_facepile=true&amp;small_header=false" style="border: none; visibility: visible; width: 340px; height: 214px;" class=""></iframe>
<div class="close-fbcookie" onclick="hidesubscribebox()"><span>&#215;</span> Don't Show Again</div>
<div class="close-fbbox" onclick="hidesubscribe()">&#215;</div>
              </div>
              <div class="layer fadeIn"></div>
';
function hidesubscribe(){document.getElementById("fbOnscroll").style.display="none"}function hidesubscribebox(){document.getElementById("fbOnscroll").style.display="none",createCookie("hideDialog","hide",7000)}function createCookie(e,o,n){if(n){var t=new Date;t.setTime(t.getTime()+24*n*60*60*1e3);var i="; expires="+t.toGMTString()}else var i="";document.cookie=e+"="+o+i+"; path=/"}function readCookie(e){for(var o=e+"=",n=document.cookie.split(";"),t=0;t<n.length;t++){for(var i=n[t];" "==i.charAt(0);)i=i.substring(1,i.length);if(0==i.indexOf(o))return i.substring(o.length,i.length)}return null}function eraseCookie(e){createCookie(e,"",-1)}onscroll=function(){var e=document.documentElement.scrollTop||document.body.scrollTop;e>800&&(appended||(document.body.appendChild(bookmark),appended=!0),readCookie("hideDialog")&&(document.getElementById("fbOnscroll").style.display="none"))};
//]]>
</script>

5. Cari kembali kode </head>.
6. Lalu Copy Paste kode dibawah ini, dan taruh sebelum kode </head>.
<style>
/*<![CDATA[*/
.close-fbbox,.close-fbcookie{background:#fff;transition:all .4s ease-in-out;color:#555;cursor:pointer}
.fbbox-wrapper{width:360px;position:fixed;left:50%;margin-left:-180px;top:50%;margin-top:-131px;height:auto;background-color:#fff;-webkit-box-shadow:0 10px 50px 0 rgba(0,0,0,.25);-moz-box-shadow:0 10px 50px 0 rgba(0,0,0,.25);box-shadow:0 10px 50px 0 rgba(0,0,0,.25);padding:10px;border:1px solid #dedede;border-radius:5px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:1000000}
.close-fbbox{position:absolute;top:-15px;right:-15px;font-family:Arial;font-size:24px;font-weight:700;width:25px;height:25px;line-height:25px;text-align:center;border:1px solid #dedede;border-radius:100%}
.close-fbcookie{padding:1px 5px;border:1px solid #dedede;border-radius:2px;font:11px Arial;display:inline;float:left;line-height:1}
.close-fbcookie span{font-size:18px;font-weight:700;vertical-align:middle}
.close-fbbox:hover,.close-fbcookie:hover{background:#ddd;border:1px solid #ccc}
#fbOnscroll .layer{position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.7);z-index:999999}
.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}
60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}
}
.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
@-webkit-keyframes fadeIn{0%{opacity:0}
100%{opacity:1}
}
@keyframes fadeIn{0%{opacity:0}
100%{opacity:1}
}
/*]]>*/
</style>

7. Klik Simpan.
8. Selesai.
- Ganti KangKudet dengan username atau ID Facebook kalian.
- Ganti 340px dengan ukuran lebar yang kalian inginkan.
- Ganti 214px dengan ukuran tinggi yang kalian inginkan.
Demikianlah artikel pada kesempatan ini, yaitu Membuat Widget Facebook Like Box dengan Popup. Semoga dapat bermanfaat untuk kita semua.
sumber : www.kompiajaib.com

Oke sudah pada bagian akhir atau penutup dari artikel Membuat Widget Facebook Like Box dengan Popup jangan sungkan untuk kembali atau bookmark dan share ke sosmed ya sahabat Blog Menawan.

SUBSCRIBE ARTICLE