Cara Membuat Facebook Like Melayang

Pada postingan kali ini kita akan belajar Cara Membuat Facebook Like Melayang  dengan tampilan yang dinamis dan keren untuk mendukung optimasi SEO kita tentunya,oke langsung saja kita praktekan caranya.

LANGKAH 1
1.  Login ke Blogger --> Dashboard  --> Template
2.  download template untuk menghindari error
3.  kemudian Edit HTML
4.  Gunakan Ctrl+F temukan kode </head>
5.  kemudian copy dan paste kode dibawah setelah kode </head>:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
6. simpan template.

LANGKAH 2
1.  Sekarang buka Layout--> klik pada "Add a gadget".
2.  Pilih "html/java script" dan copy dan pastekan kode di bawah ini dan simpan .
  <script type="text/javascript"> /*<![CDATA[*/ jQuery(document).ready(function() {jQuery(".abtlikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);}); /*]]>*/ </script> <style type="text/css"> .abtlikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhftkCsSHvMj33tKX1sYTFwxFfUZ_cLJ5ZPDlUoy1FQ83apiq3AZ9255Q7Ubh7z_udbupu3eYxPY1i3BWTT5eYu3Xf87YZbOzITRsh5vWX7HWq-btwb6ZNeqsxz0mCnYuOkSlZs4S4ZU94/s320/fb1-right.png") no-repeat scroll left center transparent !important; float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index:  99999;position:fixed;right:-250px;top:20%;} .abtlikebox div{ padding: 0; margin-right:-8px; border:4px solid  #3b5998; background:#fafafa;} .abtlikebox span{bottom: 4px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;} .abtlikebox span a{color: gray;text-decoration:none;} .abtlikebox span a:hover{text-decoration:underline;} } </style> <div class="abtlikebox" style="">     <div>     <iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Blogging-Explore/215035195339881&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;border_color=white&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: white; overflow: hidden; height: 270px; width: 245px;background:#fafafa;"></iframe><span>Widget by :<a href="http://www.bbloggertutorials.blogspot.com"> BBloggerTutorials</a></span>     </div> </div>

Catatan: Ganti Url yg berwarna putih dengan  facebook page URL Anda.
sekarang anda lihat hasilnya...Semoga Bermanfaat.


CB Blogger Lab

About Us

LATEST POSTS