Blogger Sosyal Takip Eklentisi
Gerek Blogger gerek Wordpress bloglarda en çok kullanılan eklentilerden biri sosyal takip ekletileri. Wordpress’de hazır pluginler ile pek çok seçenek mevcut fakat Blogger için aynı durum söz konusu değil ne yazık ki. Bunun için ya Blog Hocam gibi sitelerde paylaşılan eklentilerden faydalanacaksınız ya da kod bilginizi kullanarak kendiniz bir eklenti oluşturacaksınız.
Geçmişte çok sayıda sosyal takip eklentisi paylaşmama rağmen zaman geçtikçe değişen trendler ve web teknolojileri insanları daha modern eklenti arayışına itiyor haklı olarak.
Bu yazıda Blogger kullanıcıları için fontface teknolojisi kullanılarak oluşturulmuş modern ve hızlı bir sosyal takip eklentisi paylaşacağım. Bu eklentide insanların blogunuzu Facebook, Twitter, Instagram, Google+ ve Blogger panelinden takip etmeleri için gerekli linkler, platformlara ait renkler ve ikonlar yer almakta.
Sonuç gördüğünüz görseldeki gibi olacaktır. Bu eklentiyi blogunuza eklemek için aşağıdaki işlemleri yapmanız yeterlidir.
1. Öncelikle şablona fontface kodunu eklemeniz gerekiyor. Bunun için şablonda </head> kodunu bulup üzerine şu kodu ekleyin:
2. Ardından yerleşimden HTML/JavaScript gadget olarak aşağıdaki kodları ekleyin:
Kodlarda düzenlemeniz gereken yerler var.
İyi bloglar!!!
Geçmişte çok sayıda sosyal takip eklentisi paylaşmama rağmen zaman geçtikçe değişen trendler ve web teknolojileri insanları daha modern eklenti arayışına itiyor haklı olarak.
Bu yazıda Blogger kullanıcıları için fontface teknolojisi kullanılarak oluşturulmuş modern ve hızlı bir sosyal takip eklentisi paylaşacağım. Bu eklentide insanların blogunuzu Facebook, Twitter, Instagram, Google+ ve Blogger panelinden takip etmeleri için gerekli linkler, platformlara ait renkler ve ikonlar yer almakta.
Sonuç gördüğünüz görseldeki gibi olacaktır. Bu eklentiyi blogunuza eklemek için aşağıdaki işlemleri yapmanız yeterlidir.
1. Öncelikle şablona fontface kodunu eklemeniz gerekiyor. Bunun için şablonda </head> kodunu bulup üzerine şu kodu ekleyin:
<script src="https://use.fontawesome.com/0b1db492d2.js"></script>
2. Ardından yerleşimden HTML/JavaScript gadget olarak aşağıdaki kodları ekleyin:
<div style="background:#3B5998;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.facebook.com/bloghocam" target="_blank" title="Blog Hocam'ı Facebook'ta Beğen"><span style="color:#fff"><i class="fa fa-facebook-official" aria-hidden="true"></i> Facebook'ta Beğen</span></a></div>
<div style="background:#1da1f2;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.twitter.com/bloghocam" target="_blank" title="Blog Hocam'ı Twitter'da Takip Et"><span style="color:#fff"><i class="fa fa-twitter-square" aria-hidden="true"></i> Twitter'da Takip Et</span></a></div>
<div style="background:#895a4d;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.instagram.com/username" target="_blank" title="Blog Hocam'ı Instagram'da Takip Et"><span style="color:#fff"><i class="fa fa-instagram" aria-hidden="true"></i> Instagram'da Takip Et</span></a></div>
<div style="background:#dd4b39;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="https://www.google.com/+BloghocamBlogspot" target="_blank" title="Blog Hocam'ı Google+'da Takip Et"><span style="color:#fff"><i class="fa fa-google-plus" aria-hidden="true"></i> Google +'da Takip Et</span></a></div>
<div style="background:#f3ac13;color:#fff;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.blogger.com/follow-blog.g?blogID=4490267687722891359" target="_blank" title="Blog Hocam'ı Blogger'da Takip Et"><span style="color:#fff"><i class="fa fa-user-plus" aria-hidden="true"></i> Blogger'da Takip Et</span></a></div>
Kodlarda düzenlemeniz gereken yerler var.
- Kırmızı ile gösterdiğim titleları kendi blogunuzun adını yazarak düzenleyin.
- Mavi ile gösterdiğim urlleri kendi sosyal hesaplarınızın urlleri ile değiştirin.
- Yeşil ile gösterdiğim yere blogunuzun Blogger ID’si gelecek. Bu ID numarasını bulmak için Blogger kumanda panelinden blogunuzu seçtikten sonra tarayıcının adres satırına bakın.
İyi bloglar!!!
Paylaşım için teşekkür ederim.Elinize sağlık.
YanıtlaSilHocam ne zamandır sizi takip ediyorum.sizin gi i birinden fikir almak beni onurlandırır.blogum hakkında eleştiri yaparsaniz çok mutlu olurum
YanıtlaSilsüper anlatım tüm bloglar içib grekli
YanıtlaSilelinize sağlık
YanıtlaSilÇok beğendim. Emeğinize sağlık hocam
YanıtlaSilHocam anlayışla karşılayacağını düşünüyorum. Herkesin şapkasını önüne alıp düşünmesi için yazımı burada paylaşıyorum. Şimdiden teşekkür ederim anlayışın için. https://ugurunhazinesi.blogspot.com.tr/2016/12/yeni-yeniden-teror-saldirisi.html
YanıtlaSilÇok güzel bilgi vermişsiniz hocam elinize sağlık.
YanıtlaSilhocam size 2 defa mail attım sorum vardı size yardım eder misin . https://istanitim.blogspot.com.tr/
YanıtlaSilMerhaba bolg hocam
YanıtlaSilBen senin yazılarını çok beğeniyorum kendim de uğraşıyorum
https://yeniblogrehberim.blogspot.com.tr/ sitem benim bi analiz yapar mısın rica etsem çok ihtiyacım var
Selamın aleyküm hocam ben devamını Oku eklentisi yapmak istiyorum yardımcı olursanız sevinirim
YanıtlaSilaksaraynerede.blogspot.com
hocam yine güzel bir paylaşımda bulunmuşsunuz elinize sağlık
YanıtlaSilÇok güzel bir paylaşım yapmışınız yine Serdar bey. Ayrıca uzun bir süredir Sementit
YanıtlaSiltasarımınızıda blogumda kullanıyorum. Katkılarınız için çok teşekkür ederim.
Hocam daha sade bişeyler istiyorum ya. Acaba yakında görebilir miyim.
YanıtlaSilbloguma uyguladım güzel oldu teşekkürler
YanıtlaSilokurizlergezer.blogspot.com beklerim
siteyi cok guzel gosteriyor sagolun hocam www.guncelkpssnotlari.blogspot.com
YanıtlaSilteşekkürler blog hocam :)
YanıtlaSilOlmuyor çok uğraştım ama olmadı.Şablon biçimlenmiyor. 1888. Satır sütun 14 te sürekli hata veriyor. Ne kadar uğrastıysam da sorunun kaynağını bir türlü bulamadım.
YanıtlaSilTeşekkür ederim, çok işimize yaradı :)
YanıtlaSilÇok işime yaradı, teşekkürler :)
YanıtlaSilBu yorum yazar tarafından silindi.
YanıtlaSilBlogunuzu ilgiyle takip ediyorum ve çok şey öğreniyorum hocam, elinize sağlık yine güzel bir yazı olmuş. Benim sorum; kodu head'in üzerine ekleyin derken nasıl yapmam gerekiyor acaba yardımcı olabilecek olan var mı? kod bilgim sıfır :(
YanıtlaSil