Yazıların sol tarafında, yazı ile birlikte kayan sosyal paylaşım butonlarını birçok yabancı blogda görmüşsünüzdür diye düşünüyorum. Gerçi ülkemizdeki birçok blogda da son dönemlerde bu özellik moda oldu diyebiliriz. Bu özelliğin en önemli yararı ise; blogunuzun sosyal paylaşım siteleri ile arasının iyi olduğunun göstergesi olması. Böylelikle yazınızı okuyanlar da, hızlı bir şekilde (acaba sosyal paylaşım butonları nerede?) diye düşünmeden, yazınızı sosyal paylaşım sitelerinde paylaşabilecekler. Dolayısı ile bu özellik için birçok eklenti var, lâkin ben ise eklentisiz olan versiyonunu anlatacağım. Böylelikle eklenti sayınızda da artış meydana gelmeyecek. Hemen anlatıma geçelim.

İlk olarak temanızın CSS dosyasına, aşağıdaki CSS kodlarını ekleyiniz:

.buttonsWrap{display:block;float:left;margin:10px 0 0 -110px;position:fixed;background-color: #f9f9f9;width:70px;padding-top:15px;padding-left:10px;padding-right:10px;padding-bottom:5px;border:1px solid #ccc}
.tweetBtn,.facebookBtn,.stumbleUponBtn .googleplusBtn{display:block;margin-left:1px;float:center}
.facebookBtn{margin:5px 0 5px 7px}
.googleplusBtn{margin:-5px 0 0 9px}

Daha sonra ise temanıza ait "single" adlı dosyanızda yer alan aşağıdaki kodu bulun:

<?php if(have_posts()):while(have_posts()):the_post();?>

Aşağıdaki kodları da, yukarıda bulduğunuz koddan hemen sonra ekleyin:

<div class="buttonsWrap">
<div class="tweetBtn">
<a href="https://twitter.com/share" class="twitter-share-button" data-count="vertical"></a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
</div>
<div class="facebookBtn"><iframe src="https://www.facebook.com/plugins/like.php?href=<?php the_permalink()?>&layout=box_count&show_faces=true&width=450&action=like&font&colorscheme=light&height=65" scrolling="no" frameborder="0" style="border:0;float:center;overflow:hidden;width:70px;height:65px" allowTransparency="true"></iframe></div>
<div class="googleplusBtn"><g:plusone size="tall"><script type="text/javascript">window.___gcfg={lang:"tr"};(function(){var a=document.createElement("script");a.type="text/javascript";a.async=true;a.src="https://apis.google.com/js/plusone.js";var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a,b)})();</script></g:plusone>
</div>
</div>

Not: Kayan sosyal paylaşım butonlarına ait alanı, yazınızın yanına yakınlaştırmak için CSS kodlarında yer alan buttonsWrap'taki margin'de yer alan adlı kısımdaki -110px'lik kısımı kendi temanıza göre düzenleyebilirsiniz.

Örnek Görüntü - Soldaki Butonlar