Hakkı Cengiz

Eklentisiz Paylaş Butonları Yapımı

Eveet sade, hızlı ve eklentiye ihtiyaç duymadan site oluşturmadaki adımlarımıza eklentisiz paylaş butonları ekleyerek devam ediyoruz. Öncelikle iconları çekeceğimiz bu css dosyasını

17

766

Eveet sade, hızlı ve eklentiye ihtiyaç duymadan site oluşturmadaki adımlarımıza eklentisiz paylaş butonları ekleyerek devam ediyoruz.

Öncelikle iconları çekeceğimiz bu css dosyasını <head> tagı arasına ekliyoruz.
<link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css” />
Genelde sosyal ağların belirli bir paylaşım yapma linki vardır. Bunlara bakacak olursak;

1. Öncelikle "Facebook'ta paylaş" ile başlayalım.
<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink();?>&amp;t=<?php the_title(); ?>" title="Facebookta Paylas."><i class="fa fa-facebook"></i>

Kırmızı alanda ister "Facebook'ta paylaş yazınızı yazabilir ister var olan iconu kullanabilirsiniz.

2. Twitter'da Paylaş Kodu 
<a href="http://twitter.com/home/?status=<?php the_title(); ?> - <?php the_permalink(); ?>" title="Twitle!"><i class="fa fa-twitter"></i></a>

Burada da yine aynı şekilde kırmızı ile belirttiğim alanı dilediğinizce kullanabilirsiniz.
3. Google+'da Paylaş Kodu
<a href="https://plus.google.com/share?url=<?php the_permalink(); ?>" onclick="javascript:window.open(this.href,'','menubar=no,toolbar=no, resizable=yes,scrollbars=yes,height=600,width=600');return false;"><i class="fa fa-google"></i></a>
 4. Pinterest'te Paylaş Kodu
<a href="http://pinterest.com/pin/create/button/?url=<?php the_permalink(); ?>&media=<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); echo $url; ?>"><i class="fa fa-pinterest"></i></a>
 5. Whatsapp'ta Paylaş Kodu
<a href="whatsapp://send?text=<?php echo ($title ." ". $url);?>"> <i class="fa fa-whatsapp"></i></a>
6. Linkedin'de Paylaş Kodu
<a class="linkedin" href="http://www.linkedin.com/shareArticle?mini=true&amp;title=<?php the_title(); ?>&amp;url=<?php the_permalink(); ?>" title="LinkedIn de Paylas." rel="external nofollow" rel="nofollow" target="_blank"><i class="fa fa-linkedin"></i></a>
7. Bonus: Sayfa linkini çıkartma kodu
<a href="<?php echo get_permalink( $post->ID ); ?>" title="icerik linki"><i class="fa fa-link"></i></a><br /><code><?php echo get_permalink( $post->ID ); ?></code>

EDİT: Benim düzenleyip kullandığım wordpress eklentisiz paylaşım kodları bunlar
Kendi istediğinize göre düzenleyebilirsiniz. İsteyen kendi kullandığı fotoları atsın isteyen üstte css dosyasından çeksin.

<div class="alert alert-info" role="alert">
Bilgi güçtür, paylaştıkça büyür! :) <br />
<a title="Facebook'ta Paylas" href="http://www.facebook.com/share.php?u=<?php the_permalink('') ?>" target=”_news” rel="nofollow">
<img src="<?php bloginfo('template_directory');?>/img/sos/face.png" title="Facebookta Paylaş" /></a>
<a title="Twitter'da Paylas" href="http://twitter.com/home/?status= <?php the_title(''); ?>+<?php the_permalink('') ?>" target=”_news” rel="nofollow">
<img src="<?php bloginfo('template_directory');?>/img/sos/twit.png" title="Tweetle" /></a>
<a title="Google+'da Paylas" href="https://plus.google.com/share?url= <?php the_permalink('') ?>" target=”_news” rel="nofollow">
<img src="<?php bloginfo('template_directory');?>/img/sos/google+.png" title="Google+'da Paylaş" /></a>
<a title="Pinterest'te Paylas" href="http://pinterest.com/pinthis?url=<?php the_permalink('') ?>" target=”_news” rel="nofollow">
<img src="<?php bloginfo('template_directory');?>/img/sos/pint.png" title="Pinle" /></a>
<a href="whatsapp://send?text=<?php the_permalink();?>&t=<?php the_title(); ?>” data-action=”sharewhatsapp/share" rel="nofollow">
<img src="<?php bloginfo('template_directory');?>/img/sos/whats.png" title="Whatsapp ile Arkadaşına Gönder" /></a>
<br /><i><?php echo get_permalink( $post->ID ); ?></i>
</div>

KAYNAKLAR:

  • barattalo.it/coding/fastest-social-shares-without-plugins-in-wordpress

Etiketler:

Tarih: 16 Nisan 2017

Paylaş:

766

Yorumlar (17)

İsmail Can Memiş

1 sene önce

Çok yararlı bir makale olmuş hocam. Yani insanlar artık bıktı Jetpack gibi eklentiler kullanarak sitelerini yavaşlatmaktan. Bu tür kodlar sayesinde kısa sürede işimizi halledebiliyoruz. Bir de bu kodlarla otomatik olarak tüm sosyal medyada yazılarımızı paylaşabilsek 🙂 Faydalı makale teşekkürler..

    Hakkı Cengiz

    1 sene önce

    Yorum için teşekkürler İsmail. Önemli olan sadelik ve hızlı site yapmak oldu artık. Bilgiye ne kadar hızlı erişilirse ziyaretçi o kadar mutlu olur 🙂
    Bu arada otomatik sosyal ağlarda paylaşma yapan eklenti mevcut onun hakkında yakında bir yazı yazacağım.

Kadir Emre Parlak

1 sene önce

İhtiyacım olan bilgiyi net bir şekilde gereksiz bilgi olmadan edindim. Teşekkür ederim.

Batuhan Kılınç

12 ay önce

Eklentisiz paylaşmanız güzel olmuş, basit şeyleri bile eklenti olarak eklediğimizde bir zaman sonra eklenti faciası oluşarak siteyi yavaşlatıyor 🙁 Güzel bir bilgilendirme olmuş, elinize sağlık 🙂

Volkan Sarıdağ

12 ay önce

Guzel paylasim ancak gorsellige daha cok onem verenler icin eklentiler vazgecilmez olacaktir 🙂

    Hakkı Cengiz

    12 ay önce

    Görselliği kendi yaratıcılığını kullanarak elde etmek varken eklentilerden yararlanmak başkasının izinden gitmek olur.

umut can

12 ay önce

Peki bu kodlar ile nasıl göründüğünü görebilme imkanımız var mıdır?

Hayri Kırşan

12 ay önce

Fazla sorgu tasarrufu yapmak için eklenti kullanmamak gerekiyor, gayet faydalı bir rehber

Kerim Tuncer

12 ay önce

WordPress geliştiricileri için oldukça bilgi verici bir yazı olmuş. Teşekkürler.

Mehmet Ali

12 ay önce

Eklenti siteyi fazla yoruyor, eklentisiz kod ile bu işlem yapıldığında site için yarar sağlıyor.

şafak güler

12 ay önce

güzel bir paylaşım olmuş. eklenti ile yapılan paylaşımla, paylaşımın yapılacağı yere link çıkışı yapıyor. bu sepetden dolayı eklenti ile paylaş butonları eklemeyi hiç tercih etmemiştim.

Bekir

12 ay önce

Makalenizi harfi harfine okudum ve en ince ayrıntısına kadar anlatmışsınız. Benim gibi görselliğe önem verenlerin kaçırmaması gereken bir konu...

etüthane

12 ay önce

Oldukça güzel bir kod paylaşımı olmuş siteme ekleyeceğim.

etüthane

12 ay önce

Oldukça güzel bir kod paylaşımı olmuş siteme ekleyeceğim..

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir