pada kesempatan ini saya akan berbagi cara untuk membuat atau menampilkan halaman facebook ke dalam blogger atau website dengan cara tampilan melayang .
arti tampilan melayang ini adalah jadi nantinya halaman facebook yang muncul di blog akan muncul di tengah-tengah halaman bukan di pinggir dan di situ ada tombol untuk menutup nya dengan logo x jadi jika tidak di tutup oleh pengunjung maka halaman facebook nya akan terbuka terus , namun demikian warna yang muncul tidak akan mengurangi kecerahan warna yang sebelumnya jadi misalnya tidak di tutup tetep bisa halaman blog di geser kebawah dan ke atas serta kecerahan warna tetap sama. sebagai contohnya silahakn lihat gambar di bawah ini
arti tampilan melayang ini adalah jadi nantinya halaman facebook yang muncul di blog akan muncul di tengah-tengah halaman bukan di pinggir dan di situ ada tombol untuk menutup nya dengan logo x jadi jika tidak di tutup oleh pengunjung maka halaman facebook nya akan terbuka terus , namun demikian warna yang muncul tidak akan mengurangi kecerahan warna yang sebelumnya jadi misalnya tidak di tutup tetep bisa halaman blog di geser kebawah dan ke atas serta kecerahan warna tetap sama. sebagai contohnya silahakn lihat gambar di bawah ini
lalu fungsi menampilkan halaman facebook di blog itu apa fungsinya adalah di antaranya untuk mempromosikan halaman facebook tersebut jadi supaya cepet dikenal orang banyak dan supaya cepet di sukai orang banyak.
saya kira uraian dari halaman facebook di blogger cukup jelas tapi jika masih belum jelas silahkan bertanya saja ya... , dan jika di antara kalian ingin membuat atau menampilkan halaman facebook di blog anda sendiri silahkan simak caranya di bawah ini :
1.buka blog anda lalu klik desain
2.pilih tata letak dan klik tambahkan gadged
3.lalu pilih gadged HTML/javascript
4.dan copi kode di bawah ini lalu pastekan di gadged HTML/javascript
keterangan :
- warna biru pada kode diatas ganti dengan alamat halaman facebook anda
- warna merah pada kode di atas ganti dengan nama twitter anda ( jika tidak punya twitter tidak usah di ganti )
5. setelah mengedit lalu simpan gadgednya
6.selesai..
sampai disini panduan Blogger tentang cara membuat atau menampilkan halaman facebook melayang di blogger semoga berguna, Terimakasih
saya kira uraian dari halaman facebook di blogger cukup jelas tapi jika masih belum jelas silahkan bertanya saja ya... , dan jika di antara kalian ingin membuat atau menampilkan halaman facebook di blog anda sendiri silahkan simak caranya di bawah ini :
1.buka blog anda lalu klik desain
2.pilih tata letak dan klik tambahkan gadged
3.lalu pilih gadged HTML/javascript
4.dan copi kode di bawah ini lalu pastekan di gadged HTML/javascript
<style type='text/css'>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-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;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-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:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<center><a class="murub">jika kalian suka silahkan like facebooknya ya.. </a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/dewanyapulsappob?ref=hl&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</center>
<!-- HTML End -->
<br/>
<div class="twitter">
<!-- Twitter --> <iframe title="" style="width: 230px; height: 20px;" class="twitterx-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351& align=&button=blue&id=twitter_tweet_button_0& lang=ID&link_color=&screen_name=baladhani_19&show_count=& show_screen_name=&text_color=" frameborder="0" scrolling="no"></iframe> </div>
<div style="text-align: center;">
<a href="http://www.mahadewapulsa.com/p/beranda.html" target="_blank">Get This Widget</a></div>
<a class='close' href='#'>×</a>
</div>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-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;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-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:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<center><a class="murub">jika kalian suka silahkan like facebooknya ya.. </a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/dewanyapulsappob?ref=hl&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</center>
<!-- HTML End -->
<br/>
<div class="twitter">
<!-- Twitter --> <iframe title="" style="width: 230px; height: 20px;" class="twitterx-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351& align=&button=blue&id=twitter_tweet_button_0& lang=ID&link_color=&screen_name=baladhani_19&show_count=& show_screen_name=&text_color=" frameborder="0" scrolling="no"></iframe> </div>
<div style="text-align: center;">
<a href="http://www.mahadewapulsa.com/p/beranda.html" target="_blank">Get This Widget</a></div>
<a class='close' href='#'>×</a>
</div>
keterangan :
- warna biru pada kode diatas ganti dengan alamat halaman facebook anda
- warna merah pada kode di atas ganti dengan nama twitter anda ( jika tidak punya twitter tidak usah di ganti )
5. setelah mengedit lalu simpan gadgednya
6.selesai..
sampai disini panduan Blogger tentang cara membuat atau menampilkan halaman facebook melayang di blogger semoga berguna, Terimakasih
No comments:
Post a Comment