Halaman

Rabu, Disember 14, 2011

Meletakkan social widget di sidebar




Salam bahagia,


Saya baru ajer meletakkan sosial button di sidebar, yang ini 'compact' sikit.. tak perlu dah nak buat satu-satu.. sekali arung jer..






Jadi untuk kawan-kawan yang ada fanpages @ laman FB, ada akaun google+ dan akaun twitter boleh lah letakkan button ni di sidebar.


Untuk kod dan tutorialnya sila semak ke MariBinaBlog., Cara pasang Sidebar Social Widget di Blogspot


Btw, ini kod yang saya punya.. kot-kot lah terdelete ke apa.. boleh lah saya refer di lain masa




<style>
#sidesocial{
border:0 solid #;
}
.sideg{
background: white
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCG_DCla0UupyghbbKrUB6YCjBWPL9phMtrFSX4M-EzpgsZK4FJBpkXfGE-vF6Vd8VmTQfOyNG8sjJVw7wjXtDayx07GDMpoTPVWhFXegvqoFigF578wWUEFFFYDdUC8cYFZFJcrDBiZ31/s320/gradient.png) repeat-x 0 -100px!important;
font-size:0.85em;
color:#000;
line-height:1px;
border-top:1px solid white;
border-bottom:1px solid white;
padding:5px 11px
}
.sideg span{
vertical-align:text-top;
color:#333;
margin:2px;
}
.sidetw{
background: white
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCG_DCla0UupyghbbKrUB6YCjBWPL9phMtrFSX4M-EzpgsZK4FJBpkXfGE-vF6Vd8VmTQfOyNG8sjJVw7wjXtDayx07GDMpoTPVWhFXegvqoFigF578wWUEFFFYDdUC8cYFZFJcrDBiZ31/s320/gradient.png) repeat-x 0 -100px!important;
line-height:1px;
border-top:1px solid #FFF;
border-bottom:1px solid white;
padding:4px 11px;
}
.sidefb{
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCG_DCla0UupyghbbKrUB6YCjBWPL9phMtrFSX4M-EzpgsZK4FJBpkXfGE-vF6Vd8VmTQfOyNG8sjJVw7wjXtDayx07GDMpoTPVWhFXegvqoFigF578wWUEFFFYDdUC8cYFZFJcrDBiZ31/s320/gradient.png) repeat-x 0 -100px!important;
}
.sidesub{
line-height:1px;
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCG_DCla0UupyghbbKrUB6YCjBWPL9phMtrFSX4M-EzpgsZK4FJBpkXfGE-vF6Vd8VmTQfOyNG8sjJVw7wjXtDayx07GDMpoTPVWhFXegvqoFigF578wWUEFFFYDdUC8cYFZFJcrDBiZ31/s320/gradient.png) repeat-x 0 -100px!important;
border-top:1px solid white;
padding:3px 10px;
}
.sidesub span{
width:115px;
}
</style>
<div id="sidesocial">
<div class="sidefb">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FLaman-Kakyongdotcom%2F172935636135077&amp;width=280&amp;height=183&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%2382CDFC&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:280px; height:190px;" allowtransparency="true"></iframe>
</div>

<div class="sideg">
<div class="g-plusone" data-size="medium" data-href="http://ibualiya.blogspot.com"></div><span>Recommend on Google</span>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
</div>

<div class="sidetw">
<a href="https://twitter.com/Ibu3A" class="twitter-follow-button">Follow @YOU</a>
<script src="//platform.twitter.com/widgets.js" type="text/javascript"></script>
</div>

<div class="sidesub"><form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=KeluargaIbu3a', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input type="submit" value="Subscribe" /><span><input type="text" style="width: 165px;
padding: 0px 0px 0px 0px;
vertical-align: middle;
font-size: 0.85em;
margin-top: -1px;
margin-left: 15px;" name="Masukkan email" value="        Masukkan Email"       onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/><input type="hidden" value="KeluargaIbu3a" name="uri"/><input type="hidden" name="loc" value="en_US"/></span></form>
</div>
</div>



Kod saya ni berbeza sikit dari NescafeAis (owner MariBinaBlog), dia punya berwarna-warni.. saya punya saya kekalkan semua putih.. saya sesuaikan dengan tema blog saya.


Selamat mencuba pada kawan-kawan. Tak perlu update dalam template, hanya tampalkan di sidebar sahaja.


..
Jangan lupa join contest & giveaway ibu sihat anak riang
..


p/s
Buat kawan-kawan yang dah LIKE Laman Kakyongdotcom tu.. boleh ajer bila2 masa nak ping entry blog ke situ... tapi tolong jangan SPAM yer.. 



salam kasih sayang,
..



4 ulasan:

  1. comel pulk nampak tu
    ada update entri baru lagi

    BalasPadam
  2. @tehr update entri baru??? eh, mana ada update n3 baru dlm widget tu...

    fenin jap nak memaham maksud tehr ni... :p

    BalasPadam
  3. sy sebenarnya tak berapa faham dengan maksud SPAM tu..macam mana nak spam kakyong?adakah dengan copy paste link je boleh SPAM?

    BalasPadam
  4. @Puan Kutu

    SPAM tu.. bila kita ping entry utk iklan @ iklan busines yg tdk disenangi, berkali-kali.. cth dlm 1 hari, sampai 10 kali dok ping n3 yg sama.. jika pun n3 dia tu bagus.. n3 blog ke, n3 mini telenovel PK tu.. x perlu lah ping sampai tiap jam kan.. org lain pun rasa tak best..

    BalasPadam

Terima kasih atas komen kome..