Sidebar widget style dan function

Sedikit tips bagaimana cara customize style dan function beberapa widget.

Cara customize Follow By Email Widget

1. Bagi memaparkan title Get Updates tersebut. Hanya perlu namakan title widget tersebut mengikut keyword yang anda ingini.

2. Manakala untuk merubah deskripsi bagi memastikan anda alert tips dari kami itu, anda hendaklah masukkan code dibawah ke textarea Add Custom CSS.

.custom .FollowByEmail .widget-content:before { content: 'Deskripsi yang anda inginkan disini'; }

letakkan code diatas tersebut ke Template › Costumise › Advanced › Add CSS

Widget Sticky sangat berguna untuk blog yang generate income melalui iklan seperti Google Adsense. Malah boleh juga dimanipulasikan untuk meningkatkan pageview !

Sebagai info: Sidebar widget sticky yang dimaksudkan adalah widget yang ‘fixed’ atau ‘sticky’ apabila page di scroll up dan scroll down. Dengan adanya widget sticky ini, sidebar tidak akan dibiarkan kosong. Dimana terdapat widget yang berposisi sticky (sentiasa kelihatan) akan timbul apabila terdapat ruang kosong pada sidebar. Boleh rujuk [BLOGPOST INI]. Sila scroll down perlahan² hingga kebawah; dan perhatikan widget yang timbul tersebut.

Secara default, Thesis blogger template akan menggunakan widget yang terakhir pada sidebar anda untuk dijadikan Sticky widget apabila di scroll.

Namun demikian, anda juga boleh customize function ini dengan wrap/tutup mana² widget tertentu dengan id="fixed-widget" seperti dibawah:

<div id="fixed-widget">

<!-- Masukkan code widget content anda dibawah, sama ada code iklan atau sebagainya -->

</div>

Meletakkan satu widget yang di wrap dengan id="fixed-widget", widget tersebut akan menjadi sticky (walaupun placement bukan widget terakhir pada sidebar)

Sticky widget tidak working? mungkin adalah boleh rujuk link ini

Compact Social Profile Widget Code

<div id="socialnetworking"> <!-- Begin Widget -->

 <div class="fb-likebox"> <!-- Facebook -->

<div class="fb-page" data-href="LINK_FB_FANPAGE_ANDA" data-small-header="true" data-adapt-container-width="false" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"><blockquote cite="LINK_FB_FANPAGE_ANDA"><a href="LINK_FB_FANPAGE_ANDA">NAMA_FB_FANPAGE_ANDA</a></blockquote></div></div>

 </div>
 <div class="googleplus button"><span>Connect On G+</span> <!-- GooglePlus -->
<g:follow data-height="24" href="LINK_PROFILE_GOOGLE+_ANDA" rel="author"></g:follow>
 
 </div>

<div class="fb button"><span>Become Our Fans!</span> <!-- Twitter -->
        <iframe src="//www.facebook.com/plugins/like.php?href=LINK_FANPAGE_ANDA&amp;send=false&amp;layout=button_count&amp;width=450&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font=segoe+ui&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowtransparency="true"></iframe>

 </div>

 <div class="twitter button"> <!-- Twitter -->
        <a class='twitter-follow-button' href='LINK_PROFLE_TWITTER_ANDA'>Follow @USERNAME_TWITTER_ANDA</a>

 </div>

 <!-- End Widget --></div>



<script type='text/javascript'>
//<![CDATA[
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs'); 
//]]></script>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Sila ubah text yang berwarna oren pada code diatas dengan link dan nama profile social media anda. Hasilnya seperti screenshot dibawah: