HTML Eklentisiz Paylaş Butonu Kodları
Karmaşık ve çok fazla JS kodu içerek Paylaş Butonu eklentileri yerine bir kaç satır basit kod ile siteniz için sosyal medya paylaşım butonları ekleyebilirsiniz. Hazır bir şekilde vereceğim kodları sitenizde belirtilen yerlere ekleyerek çok fazla kod bilgisi gerekmeden bu işlemi yapabilirsiniz.
Paylaş Butonu Nedir?
Paylaş butonu, sitenize gelen ziyaretçilerin beğendikleri içerikleri sosyal medya hesaplarında arkadaş çevresine veya telefonunda kayıtlı kişilere hızlı ve kolay bir şekilde göndermesini sağlayan butonlardır.
Paylaş Butonu Zararlı Mıdır?
Hayır zararlı değildir aksine paylaşım yapan kişilerin çevresi de sitenize geleceği için, her gelen yeni ziyaretçi size +1 tekil hit olur. Paylaşılan bir link ile gelip diğer yazılarınızı da okumak isteyenler sitenizde geçirilen zamanı artırır. Ayrıca gelen ziyaretçiler sitenizi gerçekten faydalı bulursa tekrar tekrar gelerek daimi okuyucunuz olabilir. Gördüğünüz gibi arka arkaya gelebilecek olan tüm bu olaylar 50-100 kişinin paylaşım yapması sonucu binlerce kişiye ulaşmanızı sağlayabilir.
Eklentisiz Paylaş Butonu Kodları
Aşağıdaki kodları butonların görünmesini istediğiniz sayfaya ekleyiniz. Siteniz wordpress ise single.php veya sizin temanızın içerik sayfası hangisiyse bu kodu yazı başına ve yazı sonuna ekleyebilirsiniz. Sayfa içerisinde yazının olduğu kod wordpress sitelerde genel olarak <?php the_content(); ?> kodu olmakta veya bu kodla başlamaktadır.
<div class=”TLpaylas” style=”padding-bottom:20px”>
<span>Paylaş:</span> <a class=”facebook” href=”https://www.facebook.com/sharer.php?u=<?php the_permalink();?>&t=<?php the_title(); ?>” title=”Bu Haberi Facebook’da Paylaş” onclick=”window.open(this.href); return false;”>Facebook</a>
<a class=”twitter” target=”_blank” href=”http://twitter.com/intent/tweet?text=<?php the_title(); ?>: <?php the_permalink(); ?>” title=”Bu Haberi Twitter’da Paylaş”>Twitter</a>
<a class=”whatsapp” target=”_blank” href=”https://wa.me/?text=<?php urlencode(the_permalink());?>”>Whatsapp</a>
<a class=”yazdir” href=”javascript:void(0);” onClick=”window.print()”>Yazdır</a>
</div>
Daha sonra bu butonlara biraz şekil vermek için aşağıdaki kodları temanızın CSS dosyasında en altta bir yere ekleyiniz.
.TLpaylas a{display:inline-block;margin:1px;padding:7px;color:#fff;border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;-webkit-border-radius:5px;-ms-border-radius:5px;font-size: 13px;text-align:center;text-decoration:none;}
.TLpaylas span{font-size: 16px;font-weight:bold;}
.twitter{background:#55acef;color:#fff!important;}
.facebook{background:#3B5998;color:#fff!important;}
.whatsapp{background:#00e676;color:#000!important;}
.yazdir{background:#FFF;border:1px solid #ccc;color:#444!important;}
WordPress veya HTML siteleriniz için eklentisiz paylaş butonu eklemek işte bu kadar kolay.
