Blogspot'ta Eklentileri Ortalamak

Sevgili Dostlar;

Kaç zamandır şu final sınavları muhabbetine bir türlü ayılıp yayın yapamıyorum, nerdeyse cinnet noktasındaydım sonunda yayınlara devam ediyorum kaldığım yerden...

Evet bugün sizlere eklenti paylaşmak isterdim fakat eklentileri kullanırken çok işimize yarayacak bir olayı sizlerle paylaşmak istedim..."Blogspot Widget/Gadget Ortalama" muhtemelen sizlerde karşılaşmışsınızdır, bazı eklentileri bloga yerleştirdiğinizde, eklenti sağa dayalı yahut sola dayalı durduğunu ve bunun sizin istediğiniz görüntüyü bozduğunu görmüşsünüzdür muhakkak!

Bu gibi durumlardan kurtulmak için ise eklediğiniz widget/gadget'ı ortalamak gerek, şimdi bunu nasıl yapıyoruz ona gelelim;

* Blogunuza eklediğiniz eklentinin kodunu, aşağıdaki kırmızı renkli kodları arasına yerleştiriyoruz.

<center> EKLENTİ KODUNU BURAYA EKLİYORUZ </center>

Not: Eklentiyi hizalarken bir püf nokta var, nedense bunu kimse yazmamış; widget'i ortalama yaparken widget kodunun tamamını yukardaki kodlar arasına almayacaksınız. Ekleyeceğiniz widget'e göre değişebilir, hemen birkaç örnekle başlayalım.

Örnek 1 - Auto Ping

Şu an bu blogun sol alt köşesinde ki Auto Ping eklentisi, "<a href=" veya "script" yapısı ile başlayan eklentilerde de aynen şu şekilde yolu izledim;

<center><!-- auto ping by http://www.auto-ping.com/ -->
<a href="http://www.auto-ping.com/pinger" target="_blank"><img src="http://www.auto-ping.com/iping.php?aut=EF14380489BD68920487F89D5739455201155A64B924A54A750E6D8DD2AD0BC1854A7AD421A02FC8C1" alt="Ping your blog, website, or RSS feed for Free" border="0" /></a>
<!-- auto ping by http://www.auto-ping.com/--></center>

Örnek 2 - Disqus Son Yorumlar Eklentisi

Sağ taraftaki Tweet'lerin hemen altında, Disqus'un son yorumlar eklentisi. Tabi bu eklentiyi bloga eklemek için önce Disqus eklemek gerek :) Son yorum eklentisi "div" yapısıyla başladığı için şu şekilde bir yol izledim;

<div id="recentcomments" class="dsq-widget"><center>
<h2 class="dsq-widget-title">Son Yorumlar</h2><marquee direction="up" height="200" loop="99999" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="1" scrolldelay="60" width="295">
<script type="text/javascript" src="http://usefultoolstrblogspotcom.disqus.com/recent_comments_widget.js?num_items=8&hide_avatars=0&avatar_size=32&excerpt_length=300&hide_mods=0"></script></marquee></center>
</div>

Hemen "div" yapısının içine yerleştirdim, çok güzel çalıştı...

Not: Bu arada yukarıdaki eklenti kodları içinde yazının kayması için gerekli kodlar var onları sonradan ekledim bunu ayrıca anlatacağım.

Örnek 3 - Popüler Yayınlar

Popüler yayınlar eklentisini hizalamak için ilk önce Kumanda Paneli/Şablon/HTML'yi Düzenle yolunu izleyerek şablonumuzun kodlarını açıyoruz, hemen ardından ortalamak istediğimiz kodları bulmak için Ctrl + F diyerek eklentimizin adını yazıyoruz. Eklentimizi bulduğumuzda kodlar kapalı olabilir yani şu şekilde;

<b:widget id='HTML9' locked='false' title='' type='HTML'>...</b:includable>

Bu şekilde ise hemen sol taraftan kodları genişletin, anlatıma kendimdeki Popüler Yayınlar kodlarıyla devam ediyorum;

<b:widget id='PopularPosts1' locked='false' title='Popüler Yayınlar' type='PopularPosts'>     <b:includable id='main'>         <center>           <b:if cond='data:title'>             <h2>               <data:title/>             </h2>           </b:if>           <div class='widget-content popular-posts'>             <ul>               <b:loop values='data:posts' var='post'>                 <li>                   <b:if cond='data:showThumbnails == &quot;false&quot;'>                     <b:if cond='data:showSnippets == &quot;false&quot;'>                       <!-- (1) No snippet/thumbnail -->                       <a expr:href='data:post.href'>                         <data:post.title/>                       </a>                       <b:else/>                       <!-- (2) Show only snippets -->                       <div class='item-title'>                         <a expr:href='data:post.href'>                           <data:post.title/>                         </a>                       </div>                       <div class='item-snippet'>                         <data:post.snippet/>                       </div>                     </b:if>                     <b:else/>                     <b:if cond='data:showSnippets == &quot;false&quot;'>                       <!-- (3) Show only thumbnails -->                       <div class='item-thumbnail-only'>                         <b:if cond='data:post.thumbnail'>                           <div class='item-thumbnail'>                             <a expr:href='data:post.href' target='_blank'>                               <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>                             </a>                           </div>                         </b:if>                         <div class='item-title'>                           <a expr:href='data:post.href'>                             <data:post.title/>                           </a>                         </div>                       </div>                       <div style='clear: both;'/>                       <b:else/>                       <!-- (4) Show snippets and thumbnails -->                       <div class='item-content'>                         <b:if cond='data:post.thumbnail'>                           <div class='item-thumbnail'>                             <a expr:href='data:post.href' target='_blank'>                               <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>                             </a>                           </div>                         </b:if>                         <div class='item-title'>                           <a expr:href='data:post.href'>                             <data:post.title/>                           </a>                         </div>                         <div class='item-snippet'>                           <data:post.snippet/>                         </div>                       </div>                       <div style='clear: both;'/>                     </b:if>                   </b:if>                 </li>               </b:loop>             </ul>             <b:include name='quickedit'/>           </div>         </center>       </b:includable>
<b:includable id='main'> ile başlayan kodun hemen altına hizalama kodunun açılışını yazıyoruz (<center>), widget kodunun hemen alt kısmındaki </b:includable> ifadesinin hemen üstüne de hizalama kodunun kapanışını yazıyoruz (</center>). Popüler Yayınlar widget'i için de böyle bir yöntem uyguladım.
Tabi ki son uyguladığım yöntemle Takip Ettiklerim vs bir çok widget'i ortalayabilirsiniz. Artık eklentilerden hangisini ortalamak isterseniz rahat rahat ortalayın, yukarıdaki yöntemlerin hepsi tarafımdan denenmiştir sorunsuz çalışmaktadır.

Kafanıza takılan soru olursa yorum bırakın ve yaptığınız yoruma e-mail ile abone olun yazılan cevaplar mail adresinize gelsin...İyi günlerde kullanın, esenle kalın...