Blogger'a JQuery Animasyonlu Sosyal Medya Sekme Butonlarını ekleme

Blogger'a JQuery Animasyonlu Sosyal Medya Sekme Butonlarını ekleme:

1. Blogger kontrol panelinize giriş yapın > Şablon
2. Şablonunuzu yedeklemeyi unutmayın.
3. HTML'yi Düzenle
4. </body> kodunun hemen üstüne aşağıdaki kodları kopyalayıp yapıştırın:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<div id="mefmed">
<script type="text/javascript" src="http://meftun-mede.googlecode.com/svn/trunk/Meftun_Sosyal_bar.js"></script>
</div>
<link href='http://meftun-mede.googlecode.com/svn/trunk/Meftun_Sosyal_bar.css' rel='stylesheet' type='text/css'/>
<!-- Animasyonlu Sosyal Medya Bar By www.meftunmede.com -->
<script type="text/javascript">
$(document).ready(function(){
$.mefSocialBar({
items: {
facebook: { url: '#', text: 'Facebook Profili' },
twitter: { url: '#', text: 'Twitter Profili' },
google: { url: '#', text: 'Google+ Profili' },
youtube: { url: '#', text: 'Youtube Profili' },
pinterest: { url: '#', text: 'Pinterest Profili' },
stumbleupon: { url: '#', text: 'Stumbleupon Profili' },
reddit: { url: '#', text: 'Reddit Profili' },
rss: { url: '#', text: 'RSS Feed' },
},
show: 8,
position: "left",
skin: "clear"
});
});
</script>

Not: Zaten jQuery kütüphanesi kaynak kodu blogunuzda yüklü varsa kırmızı renkle işaretlediğim kodu eklemeyin.
(<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>)

Özelleştirme

Eklentiyi özelleştirmek ve denemek için Online Html editörde istediğiniz şekilde aşağıdaki değişikleri yapabilirsiniz.

• URL'yi ekleme: "#" işaretli olan yerlere sosyal medya hesaplarınızı yazın.
• Pozisyonları değiştirme: Widget konumunu isteğinize göre değiştirin:
  Kodlama:
  “left” = Sol,
  “right” = Sağ,
  “top” = Yukarı,
  “bottom” = Aşağı
  Unutmayın: Büyük Harfler kullanmayın, aksi takdirde çalışmaz.
• Sosyal Medya butonları: Sosyal medya butonları yukarıdaki örnekte "8" tanedir. Azaltmak veya çoğaltmak isterseniz; istemediğiniz buton bölümünü script kodundan silerek, yada istediğiniz butonu ekleyerek, show:8, yazan yerdeki sayısal değeri 10 veya 7,6,5 gibi değiştirebilirsiniz.
• Kullanabilir Butonlar: Yeşille işaretlediğim yerlerde bu sosyal medya iconlarını kullanabilirsiniz;
  twitter, facebook, rss, google+, youtube, stumbleupon, reddit, pinterest, instagram, vk, linkedin, tumblr, xing, myspace, digg, flickr, foursquare, vimeo, soundcloud
• Arayüzü değiştirme: Sosyal Medya Barda iki Tema var yani “clear” = açık renk ve “dark” = siyah renkte arka plan. Güncel “clear” = açık renk temasını değiştirmek için JavaScript kodlamada “dark” = siyah renk olarak değiştirebilrsiniz.

5. Son olarak Şablonu kaydet diyip çıkıyoruz. işlem bukadar!
Barış ve bereket Arkadaşlar!Herkeze kolay gelsin. Yapamadığınız bir şey olursa "YORUM" kısmında belirtebilirsiniz. iyi bloglamalar...