468x60 Ads

Cara Lain Membuat Elemen Sembunyi disisi Kanan

Unknown | 15:00 | , ,
Kawan masih ingat dengan postingan saya Cara Membuat Elemen Sembunyi disisi Kanan :z; itu sebagai ilustrasi  saja karena yang akan saya bahas sekarang Cara Lain Membuat Elemen Sembunyi disisi Kanan yang bisa kawan Simpan File / Script Iklan / Iframe atau yang lainnya

screenshot

Cara Membuatnya :

  • Masuk Account Blogger dengan ID kawan
  • Pada Home / Dasbor pilih Template - Edit HTML
  • Copas Script berikut dibawah ]]></b:skin> atau diatas </head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>

Seandainya pada Template kawan sudah ada script jquery diatas [walau seri berapa saja] maka script tersebut tak usah ditambahkan lagi 
  • Selanjutnya pilih Tata Letak - Tambahkan Gadget 
  • Pilih tanda + pada HTML / JavaScript
  • Copas script berikut kedalamnya [bisa digabung dengan Gadget yang sudah ada]


<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".bbcslikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-310"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.bbcslikebox{background: url("http://i.picasion.com/pic63/e58865b7a360e9be1c5568bd5d6832f6.gif") no-repeat scroll left center transparent !important;display: block;float: right;height: 260px;padding: 0 5px 0 40px;width: 290px;z-index: 99999;position:fixed;right:-310px;top:60%;}
.bbcslikebox div{border:none;position:relative;display:block;}
.bbcslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 7px;text-align: right;z-index: 99999;}
.bbcslikebox span a{color: gray;text-decoration:none;}
.bbcslikebox span a:hover{text-decoration:none;}
</style>
<div class="bbcslikebox" style="">
    <div>
 <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2FBlogbegoCreation&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=260" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 260px; width: 300px;background:#fff;"></iframe>    </div>
</div>
Penjelasan :
  • Kode teks http://i.picasion.com/pic63/e58865b7a360e9be1c5568bd5d6832f6.gif yang berwarna merah adalah Url Image FBLike silahkan ganti disesuaikan dengan isinya 
  • top:60% adalah posisi tampilan 60% dari atas, yang bisa kawan rubah 
  • Script <iframe s/d </iframe> adalah FaceBook Like seperti contoh diatas, kawan tinggal mengganti BlogbegoCreation dengan Account FaceBook kawan :x; dan kawan bisa menghapus semuanya untuk menyimpan script Iklan atau File lainnya disana 
  • Simpan Blog kawan


0 Kommentare:

Kommentar veröffentlichen