Monday, 25 March 2013

Cara membuat like box facebook tersembunyi




Pengguna Facebook semakin hari semakin ramai,hal ini menyebabkan ramai blogger sibuk membuat sebuah social plugins di blog atau laman web mereka.Bagi mereka yang mempunyai ramai fan page di facebook mereka pasti tidak akan melepaskan peluang ini dan sebahagian besar para blogger sudah memasang   like box yang disediakan oleh facebook.

Mungkin banyak blogger pening kepala kerana tidak mempunyai ruang di blog mereka bagi menambah widget terbaru,ini merupakan jalan penyelesaian bagi para blogger untuk mempunyai pelbagai widget yang menarik dan kemas.Widget ini akan tersembunyi di tepi blog dan akan keluar apabila disentuh.

Adakah anda ingin meletakkan widget ini di blog anda?jika jawapannya ya maka anda perlu mengikut langkah-langkah di bawah.


1)Login ke Blogger
2)Klik pada rancangan>>Add widget>>HTML/Javascript
3)Paste kod di bawah pada ruang yang disediakan.

<<mula dari sini>>

<HTML><META HTTP-EQUIV="content-type" CONTENT="text/html;charset=utf-8">
&lt;script 
type="text/javascript"&gt;<BR>//&lt;!--<BR>$(document).ready(function() 
{$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, 
"medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 
500);});<BR>//--&gt;<BR>&lt;/script&gt;<BR>&lt;style 
type="text/css"&gt;<BR>.floatinglikebox{background: 
url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjioPUyKd7fsPrIg_BHvZZK5a_BPAmowoK-tj1tELphPTf6QARTrvieVrB5GvF8iIDEwcePEJaR9VhhwpBGdrBMMrmtxakBzKK88j4GdOlMBVI11JUJX38CV_mGJPtD_qzIu2dABp0Fxvg/s1600/floatingfb.png") 
no-repeat scroll left center transparent !important;display: block;float: 
right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 
99999;position:fixed;right:-250px;top:20%;}<BR>.floatinglikebox 
div{border:none;position:relative;display:block;}<BR>.floatinglikebox 
span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: 
absolute;right: 6px;text-align: right;z-index: 99999;}<BR>.floatinglikebox span 
a{color: #808080;text-decoration:none;}<BR>.floatinglikebox span 
a:hover{text-decoration:underline;}<BR>&lt;/style&gt;&lt;div 
class="floatinglikebox" style=""&gt;&lt;div&gt;&lt;iframe 
src="//www.facebook.com/plugins/likebox.php?href=<SPAN 
style="COLOR: blue">http://www.facebook.com/Bdiggfriendspage</SPAN>&amp;amp;width=251&amp;amp;height=270&amp;amp;colorscheme=light&amp;amp;show_faces=true&amp;amp;border_color=%23cccccc&amp;amp;stream=false&amp;amp;header=false&amp;amp;appId=159468740772399" 
scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; 
height:270px; background:#fff;" 
allowtransparency="true"&gt;&lt;/iframe&gt;&lt;span&gt;&lt;a 
href="http://bdigg.blogspot.com/2012/04/cara-membuat-like-box-facebook.html" 
target="_blank"&gt;+ Get This&lt;/a&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;

<<Berakhir di sini>>

*Gantikan kode berwarna biru dgn Url facebook anda.

4)Pergi ke edit HTML dan letakkan kod di bawah di atas kod </head>

<<bermula di sini>>

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

<<berakhir di sini>>

5)Save template anda dan siap.

Sekian sahaja tutorial saya bagi segmen cara membuat like box tersembunyi dan saya berharap anda mendapat manfaat daripada tutorial ini.

Filled Under:

5 comments: