20 Ocak 2014 Pazartesi

Blogger Yazar Hakkında Eklentisi

blogger author bio box widget
Blogger yazar hakkında eklentisi
Blogger blogunuzda her yazının altına yazar hakkında eklentisi ekleyerek daha kullanışlı bloglar yaratabilirsiniz. Çoğu blog'larda bu kutucuğu görmüşsünüzdür. Özellikle wordpress tabanlı sistemlerde. Bloggera' da bu eklentiyi ekleyebilmek mümkün. Eklentinin nasıl göründüğünü buradan test edebilirsiniz.
Test adresinde yada yukarıdaki resimde de görüldüğü üzere oldukça kullanışlı bir eklenti. Eklenti de profil resmi , sosyal medya butonları ,yazar hakkında , yazılara abone olma gibi özellikler bulunmakta. Özellikle sosyal medya butonları ve , yazılara abone olma eklentisi gibi eklentileri ayrıca eklemenize gerek kalmayacak bu yazar hakkında eklentisi blogunuza ekledikten sonra. Ayrıca yazar hakkında kısmına blogunuzun anahtar kelimelerini yazarak da seo anahtar kelime açısından fayda sağlayabilirsiniz.
Blogger da yazar hakkında eklentisini eklemek için  : 
  • <head> kodunu blogger şablon html'yi düzenle kısmından bulunuz.
  • Daha sonra aşağıda yer alan kodu bu kodun hemen anltına ekleyiniz.
<link href='https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-author-box.css' rel='stylesheet' type='text/css'/>

  • Daha sonra kodlar arasından post-footer-line-1 kodunu aratarak bulunuz. Bu koddan birden fazla çıkabilir. Her bir kodun altına deneyerek uygulayabilirsiniz. Bulduğunuz bu kodun altına aşağıdaki kodları yapıştırın.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='abt-author_info'>
<div class='abt-author_photo'>
<img alt='author' height='150'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0QbV94ZMR-nlJsz0Cnag0uAtmZU0p8hgAO-AL9L5CqqOxrbRTn5lLDdqCtJF-D7CY2u6YSZva59uKRHpM5Z0ZrVNcCaLfa1ZSIlnRElNBV-37jBFjRFRdk4MSJdAV3G9HsawANOwmZncL/s200/u%C4%9Fur+t%C3%BCrko%C4%9Flu.png' width='150'/>
</div>
<h2 style='color:#444;font-family:verdana;text-shadow: 3px 3px 3px 3px #ABABAB;'>Yazar : Uğur Türkoğlu</h2>
<p>Uğur Türkoğlundan Blogger üzerine,blogger eklentileri,blogger dersleri,seo teknikleri,sosyal medya,blogger temaları,blogger seo ayarları.</p>
<div class='abt-linediv'/>
<div class='abt-email'>
<small style='text-align:center;'>Yazılarıma e-mail ile abone ol!</small>
<form action='http://feedburner.google.com/fb/a/mailverify' class='abt-emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=FeedUsername&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='FeedUsername'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='abt-emailinput' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;e-mail adresini gir...&quot;;}' onfocus='if (this.value == &quot;Email adresini gir...&quot;) {this.value = &quot;&quot;}' type='text' value='E-mail adresini gir...'/>
<input class='abt-emailbutton' title='' type='submit' value='Kayıt'/>
</form>
</div>
<ul class='abt-social'>
<li class='rssicon'>
<a href='http://feeds.feedburner.com/Feedadresi'>Rss</a>
</li><li class='twicon'>
<a href='http://twitter.com/Twitteradresi'>Twitter</a>
</li><li class='fbicon'>
<a href='http://facebook.com/FBadresi'>Facebook</a>
</li><li class='gicon'>
<a href='https://plus.google.com/GplusID'>Google +</a>
</li>
</ul>
</div>
</b:if>

Yazar hakkında eklentisi Ayarları
  • Yukarıdaki kodda En üstte yer alan kırmızı renkli alandaki yere profil resminizin linkini yazınız.
  • Kırmızı renkli kodun hemen altında yer alan kısımdaki yazar hakkında kısmını ve onun altındaki ayrıntıları kendinize göre kendi blogunuza göre yazınız.
  • Kodlar da en altta yer alan Feedadresi, twitteradresi, fbadresi, gplusıd kısımlarına kendi hesaplarınızı yazınız.
  • Kaydet diyerek işlemi sonlandırın.

Etiketler: , , ,

0 Yorum:

Yorum Gönder

Yorumlarınız için teşkür ederim

Kaydol: Kayıt Yorumları [Atom]

<< Ana Sayfa