Wordpress e pluginsiz sosyal paylaşım butonları

Web tasarım, Web Programlama ve script dilleri konuları buraya
Cevapla
Kullanıcı avatarı
velociraptor
Yottabyte3
Yottabyte3
Mesajlar: 28041
Kayıt: 14 Mar 2006, 02:33
cinsiyet: Erkek

Wordpress e pluginsiz sosyal paylaşım butonları

Mesaj gönderen velociraptor » 16 Eki 2013, 22:46

Resim

eğer wordpress kullanıyor ve üstteki resimdeki gibi sosyal paylaşım butonlarına sahip olmak istiyorsanız bunun için herhangi bir plugin kurmanız gerek yok , aşağıdaki kodları kullanarak bu işi kolayca gerçekleştirebilirsiniz

1. Aşağıdaki kodu sayfanızda sosyal paylaşım butonlarının görünmesini istediğiniz herhangi bir yere ilave edin (single.php, page.php...)

Kod: Tümünü seç

<div class="social">
        <p>Share this post on:</p> 
        <!--Twitter-->
        <a class="twitter" href="http://twitter.com/home?status=Reading: <?php the_permalink(); ?>" title="Share this post on Twitter!" target="_blank">Twitter</a>
        <!--Facebook-->
        <a class="facebook" href="http://www.facebook.com/sharer.php?u=<?php the_permalink();?>&t=<?php the_title(); ?>" title="Share this post on Facebook!" onclick="window.open(this.href); return false;">Facebook</a>
        <!--Google Plus-->
        <a class="google-plus" target="_blank" href="https://plus.google.com/share?url=<?php the_permalink(); ?>">Google+</a>
</div>
2. Aşağıdaki kodu da tema klasörünüzde yeralan style.css ye ilave edin

Kod: Tümünü seç

/*social sharing buttons*/
.social a{
    display:inline-block;
    margin:10px 10px 5px 0;
    padding:10px 15px;
    color:#fff;
    font-weight:bold;
    text-align:center;
    text-decoration:none;
    border-radius:5px;
    -moz-border-radius:5px;
    -o-border-radius:5px;
    -webkit-border-radius:5px;
    -ms-border-radius:5px;
}
/*Twitter*/
.twitter{
    background:#9AE4E8;
}
/*Facebook*/
.facebook{
    background:#3B5998;
}
/*Google Plus*/
.google-plus{
    background:#D34836;
}
Demo:
http://teodora-dev.com/wordpress/
Knowledge determines destiny, And ye shall know the Truth and the Truth shall make you free



Cevapla