Lanjut ke postingan selanjutnya,,pada postingan kali ini saya akan berbagi artikel tentang blog lagi,hehehhe.
Maklumlah lagi belajar sedikit demi sedikit,lama lama menjadi sakit...hahahaha
oke langsung saja nih step by step membuat kotak facebook melayang di blog,,,,
1. Masuk akun blognya dulu.
2. Pada dashboard pilih "tata letak" lalu pilih "add gadget"
3. Copy script berikut .
<!-- FB melayang tombol close --!>
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:40%;
margin:0px 0px 0px -182px;
width:310px;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;}
#kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script type='text/javascript'>
$(window).bind("load", function() {
// animasikan nilai top saat halaman telah selesai dimuat
$('#kotak-facebook').animate({bottom:"50px"}, 1000);
// hilangkan kotak pesan saat tombol (x) di klik
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='kotak-facebook'>
<p style=" margin-right:10px; font-size:15px; color:#000000;">Please Bantu Saya,<blink> Like This !!!</blink> </p>
<!-- Mulai --!>
<div class="fb-like-box" data-href="https://www.facebook.com/vsepta2" data-width="292" data-show-faces="true" data-stream="false" data-show-border="true" data-header="true"></div>
<!-- Selesai --!><a class='close' href='#'>×</a>
<p style=" float:right; margin-right:35px; font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://kumpulan-adsen.blogspot.com/">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://bos-tutorial.blogspot.com/2013/07/inilah-memasang-widget-like-box.html">Get This Widget</a></p>
</div>
(ganti tulisan yang berwarna merah dengan alamat facebook kalian.)
4. Pada jendela add gadget pilih "Html/javascript".lalu pastekan deh kode yang tadi di copy.
5. Klik simpan. Selesai deh
Semoga bermanfaat.
Rabu, 09 April 2014
Home »
Tutorial Blogging
» Cara Membuat Kotak Facebook melayang Di Blog
Cara Membuat Kotak Facebook melayang Di Blog
-
keyboard tidak berfungsi Kalau keyboard tidak befungsi, maka kita bisa menggunakan keyboard on screen. Caranya : masuk ke start&...
-
Nah alhamdulillah ada waktu buat postingin lagi beberapa tutorial dan Tips hehehe. Untuk postingan sekarang tentang cara membuat Physical...
-
Nah sedikit artikel nih tentang komputer Built Up dan Rakitan. Karena tadi baru beli komputer, dan masalahnya adalah komputer yang saya cari...
-
Mungkin tips kali ini sudah bukan zamannya untuk dibahas karena dipostingan blog - blog lain jika kalian mensearch kata kunci Cara Mengata...
-
haii semua. alhamdulillah masih bisa diberikan kesempatan untuk posting hehehe. Oke kali ini saya ingin berbagi tips tentang komputer nih...
0 komentar:
Posting Komentar