Blogger Populer Yazılar Widget Görünümü Nasıl Değiştirilir

Populer yazılar blogumuzda yer alan ve blogumuzu ilk kez ziyaret eden okuyucular tarafından dikkat edilen önemli bir parçadır.Bildiğiniz gibi bu gadget blogger da varsayılan olarak mevcuttur.Resimli ve kısa açıklamalı ne kadar yazı gösterilmesini ayarlayabiliyoruz.Yalnız blogger standart görünümünüm dışına çıkılmasına izin vermiyor.Bu yazımda popular yazılar gadget ına ızgara şeklinde görünüm vererek onu standart görünümünün dışına çıkaracağız.image

Populer Yazılar Widget Görünümü Nasıl Değiştirilir?

Blogunuzda herhangi bir değişiklik yapmadan önce şablonunuzu yedekleyin.
  • Yerleşim den Gadget Ekle diyerek Popular Post widget ını kurun.İmage thumbnail kutucuğunu işaretini koyun ve snippet kutucuğunu boş bırakın.Kaydedin.
  • Daha sonra Şablon seçeneğinden Html Düzenle kısmına gelerek aşağıdaki kodu bulun:
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' 
type='PopularPosts'/>




  • Bu kodu aşağıdaki kodla yer değiştirin :



<b:widget id='PopularPosts1' locked='false' title='Popular Posts' 
type='PopularPosts'>


<b:includable id='main'>


  <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 == "false"'>


          <b:if cond='data:showSnippets == "false"'>


            <!-- (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 == "false"'>


            <!-- (3) Show only thumbnails -->


            <div class='item-thumbnail-only'>


              


                <div class='item-thumbnail'>


   <a expr:href='data:post.href' expr:title='data:post.title'>


    <b:if cond='data:post.thumbnail'>


                    <img alt='' border='0' expr:height='data:
thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:
thumbnailSize'/>


       <b:else/>


        <img alt='' border='0' expr:height='data:thumbnailSize' 
src='http://2.bp.blogspot.com/-erTXCq61ULM/TmHYAQBZ0GI/AAAAAAAACCs/
6cBX54Dn6Gs/s72-c/default.png' expr:width='data:thumbnailSize'/>


       </b:if>


                  </a>


                </div>         


             </div>


            <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>


</b:includable>


</b:widget>







  • Sıra geldi CSS değişikliklerine.Aşağıdaki kodu ]]></b:skin> kodundan önce ekleyin.



.popular-posts .item-thumbnail{float:left;}


.popular-posts ul{padding-left:0px;}


.popular-posts ul li {list-style-image: none;list-style-type: 
none;display:inline;}



Şimdi şablonunuzu kaydedebilirsiniz. Anasayfanızı görüntüleyin ve populer yazılar widget ın görünümünün değiştiğini göreceksiniz.


Değişiklikleri Nasıl Geri Alabilirim



Son adımda CSS kodlarını eklediğiniz kısmı silin ve populer yazılar gadget ını kaldırın.Eski görünümü kullanmak için tekrar populer yazılar widget ını ekleyin.Varsayılan görünüme geri döneceksiniz.


Populer yazıları blogunuzda kullanıyor musunuz ?Bir blog için önemli bir parça olduğunu düşünüyor musunuz?

Ozan Başer

Merhaba ben Ozan Başer. EhliBlog'da ve elbette Ehliforum (Blogculara Özel Forum)'da yazıyorum. Blogger, seo, adsense, sosyal medya ve google ürünleri hakkında faydalı ve kaliteli içeriği okuyucularıma sunmaya çalışıyorum. C#, PHP, Javascript gibi uğraşılarım var. Web ve online teknolojiler ile ilgili birçok konuda fikirlerimi sizlerle paylaşıyorum.

2 yorum:

  1. Yararlı bir konu olmuş teşekkür ederim,en kısa zamanda uygulamaya geçmek istiyorum.
    Başarılar dilerim.

    http://turkiyemodayazarlari.blogspot.com

    YanıtlaSil

Yorumunuza gelecek cevabı takip etmek "beni bilgilendir" kutucuğuna işaretleyebilirsiniz.