Cara membuat Likebox Facebook dengan tombol close

Cara membuat Likebox Facebook dengan tombol close - Untuk melengkapi postingan sebelumnya yang sudah ada mengenai facebook like box untuk merubah tampilan fanspage facebook yang terdapat didalam blog yang diterangkan pada artikel yang berjudul cara modifikasi facebook like box pada blog, maka kini seperti tema yang sama pula namun dengan penempatan widget yang berbeda karena pada fanspage facebook like box ini menggunakan style pop up yang khalayak seperti pada umumnya pop up facebook like box dan dengan efek lightbox atau warna gelap disekeliling widget. Cara memasang pop up facebook like box inipun masih sama seperti pada tutorial sebelumnya, yakni hanya dengan menambahkan kode yang ada didalam blockquote kedalam widget HTML/Javascript yang terdapat pada elemen tata letak blog. Untuk lebih jelasnya berikut tutorial cara memasang Cara membuat Likebox Facebook dengan tombol close kedalam blog.

1. Login dulu ke akun blogger anda.

2. Masuk ke Tab Rancangan >> Tata letak Add Gadget.

3. Masukkan script dibawah ini.

<style type="text/css">

* html #popupfacebook {position:absolute;} #popupfacebook {display:block; top:0px; left:0px; width:100%; height:100%; position:fixed; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu81iSFZ23OrZjl9VVRNA76vU89NSh7g9SRqHEieRMVOTE2mSiu9dEJDuJkrUq4ONsYSiN6TBWWKMiB7kYnffqIrXEQsXYBVFEqWcH54r-t69LfO44BRXVJ2qCIDICek5gs6uK8wFAZg/s128/popupideasopacity0.5.png');margin:0; overflow-y:auto;z-index:999999;} #facebookpopup {background-color: #20B2AA; overflow:none;z-index:999999;} .facebookpopup {width:290px; height:300px; position:fixed; top:45%; left:50%; margin-top:-200px; margin-left:-200px; border: 10px solid #008080; padding: 20px;z-index:999999;} #popup-title {background:#008080;color:#000;font-size:20px !important;font-weight:bold;width:324px;margin: 0 -27px 10px -27px;padding:10px;line-height:25px;text-align: center;font-family:Arial !important; float:left;} .likefaceblogevolutions { width: 280px; height: 200px; border-radius: 3px; position: relative; background: #E9FBE9; padding: 0px 10px 15px 0; margin-top:60px; } .likefaceblogevolutions,.likefaceblogevolutions:before,.likefaceblogevolutions:after { background: #E9FBE9; border: 1px solid #008080; } .likefaceblogevolutions:before,.likefaceblogevolutions:after { position: absolute; content: ""; bottom: -3px; left: 2px; right: 2px; height: 1px; border-top: none; } .likefaceblogevolutions:after { left: 4px; right: 4px; bottom: -5px; box-shadow: 0 0 2px #008080; }

</style>

<div id="popupfacebook">

<div id="facebookpopup" class="facebookpopup">

<h3 id="popup-title">Get Update Article Via Facebook</h3>

<div class="likefaceblogevolutions">

<div style="height:200px;overflow:hidden">

<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fkaze.share&amp;width=292&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;show_border=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>

</div>

</div>

<br />

<center style=" float:left; font-size:14px;cursor:pointer;" ><a style="background: #008080; padding:5px 5px 10px 5px; font-size:12px; color:#000; text-decoration:none;" onmouseup="document.getElementById('popupfacebook').style.display='none'">[X] CLOSE</a></center>

<center style="float:right;"><a target='_blank' style="font-size:xx-small; color:#000; text-decoration:none;" href="http://artugan.blogspot.com/2014/01/cara-membuat-likebox-facebook-dengan.html">Get This Widget</a></center>

</div>

</div>

4. Simpan.

Catatan: Ganti kode yang berwarna merah dengan ID Fanspage anda.

Sekian tutorial Cara membuat Likebox Facebook dengan tombol close semoga dapat membantu anda.