Web 2.0 Tarzı Sosyal Eklenti Yapımı

Bu yazımda sizlere web 2.0 tarzında sosyal eklenti yapımını anlatacağım. Bu tür eklentilere genelde blogumda yer vermedim bugüne kadar ama bu eklenti hoşuma gittiğinden ve gayet sade olduğundan sizlerle paylaşma ihtiyacı hissettim. Hemen bu eklentinin nasıl yapılacağını anlatmak istiyorum izninizle:
Öncelikle aşağıdaki kodları ]]></b:skin>{ba değil sadece b olacak} kodundan önce yapıştıralım:

#abonelik { background:#e8e9ed; width:290px; padding:0px 0px; border:0px solid #e6e6e6; border-bottom:0px solid #e6e6e6; font-size:8px; margin-left:-30px; }
.abonelik_ikon { width:286px; margin:10px auto; }
.abonelik_ikon li { display:inline; float:left; margin:0px 2px 5px 2px; width:52px; text-align:center; font-size:11px; }
.abonelik_ikon a { display:block; padding:40px 0px 2px; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; color:#444 !important; }
.abonelik_ikon a:hover { color:#26b !important; text-decoration:none; -moz-box-shadow:0px 2px 4px hsla(0,0%,0%,.35); -webkit-box-shadow:0px 2px 4px hsla(0,0%,0%,.35); }
.abonelik_ikon .abonelik_buzz a { background:url(http://konfor.enesilhan.net/resim/sosyal/sosyal-2/buzz.png) center top no-repeat; }
.abonelik_ikon .abonelik_twitter a { background:url(http://konfor.enesilhan.net/resim/sosyal/sosyal-2/twitter.png) center top no-repeat; }
.abonelik_ikon .abonelik_facebook a { background:url(http://konfor.enesilhan.net/resim/sosyal/sosyal-2/facebook.png) center top no-repeat; }
.abonelik_ikon .abonelik_rss a { background:url(http://konfor.enesilhan.net/resim/sosyal/sosyal-2/rss.png) center top no-repeat; }
.abonelik_ikon .abonelik_email a { background:url(http://konfor.enesilhan.net/resim/sosyal/sosyal-2/email.png) center top no-repeat; }

Daha sonra da blogunuzun uygun bir yerine {uygun bir yer dediğim sağ gadget olabilir, yazı içi olabilir. Diyelim ki sağ gadget da reklam diye bir gadgetınızın olduğunu varsayalım. Reklam gadgetinin üstünde yer almasını istiyorsanız bu eklentinin kodları o reklam gadgetinin üstüne ekleyeceksiniz. Umarım açıklayıcı olmuştur} aşağıdaki kodları yapıştırın:

Eğer şablonu önizlerken hata alırsanız -ki muhtemelen alacaksınız o zaman da şu adresten son verdiğim kodları çevirip o şekilde yapıştırın, o zaman kesin olacaktır. Yapamadığınız zaman haber verdiğinizde yardımcı olmaya çalışırım, herkese kolay gelsin..
Ayrıca eklentinin demosuna diğer bir sitem olan www.enesilhan.org‘dan bakabilirsiniz.

Bu yazıdan önce yazmış olduğum "Blogger Navigasyon Eklentisi" başlıklı yazımı da okumanızı tavsiye ederim.

Bu Yazıya Emoji İle Tepki Ver?

  • Beğen
  • Muhteşem
  • Hahaha
  • İnanılmaz
  • Üzgün
  • Kızgın

Herkese Merhabalar, ben Enes İLHAN. Gaziantep'te doğdum, Adana'da Büro Yönetimi ve Yönetici Asistanlığı bölümünü okudum ve 2012'de mezun oldum. Askerliğimi uzun dönem olarak, { acemiliği Ankara/Mamak'ta , usta birliğini ise Hatay/İskenderun'da } yapıp bitirmiş bulunmaktayım. Şimdi ise hayata atılmanın çabası içerisine girmiş bulunmakta olup iş bulma derdindeyim.

4 yorum

  1. Cakko   •  

    Abi dediklerini uyguladım ama yazılarla bitişik oldu gibi ne dersin ?

  2. Enes İLHAN   •  

    @Cakko,
    Alper CSS kodlarındaki margin-left:-30pxi -2 ile 8 arasında bir değer vererek önizlersen sağ tarafa doğru ortalanacaktır.

  3. oyun   •  

    tarifiniz için teşekkürler

  4. By İzocin   •  

    Enes Abi rica etsem kodlarla ilgilenebilirmisin 🙂 Demosu çok hoşuma gitti ama kuramıyorum

Bir Cevap Yazın

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

Güvenlik Sorusu ? * Time limit is exhausted. Please reload the CAPTCHA.