Blogger’a metin boyutlandırma nasıl eklenir ?

    Arkdaşlar şimdiki yazımda yazılarınızdaki karakterlerin boyutlarını isteğe göre nasıl değiştireceğimizi anlatacağım. Bu eklenti sayesinde okuma zorluğu çeken ziyaretçileriniz için kolaylık sağlamış olacak. A+‘ya basıldığında yazı içerisindeki karakterlerin puntosu 1 punto artacak A-‘ye nasıldığında ise 1 punto azalacaktır.

    Kurulum

    Blogger hesabımıza giriş yapıp Tasarım » HTML’yi Düzenle kısmından Widget Şablonlarını Genişlet işaretledikten sonra

    ]]></b:skin>

    kodunu buluyoruz ve üstüne aşağıdaki kodları olduğu gibi yapıştırıyoruz.

    <style type='text/css'>

    /*----- Text Resizer By MBT ------*/
    .controlstyle a{ /*links inside DIV sizecontroldiv*/
    outline:none;
    }
    .controlstyle a img{ /*image links inside DIV sizecontroldiv*/
    border-width:0;
    }
    .controlstyle a.selectedcontrol img{ /*selected control&#39;s image*/
    border-bottom:4px solid darkred;
    }
    .mbt-text-resizer{
    font-weight:bold!important; color:#F07727!important; text-decoration:none!important; font-family:arial,tahoma !important; font-size:16px!important;
    }

    #mbt-text-resizer-container {
    margin:4px 0px;
    padding:4px;
    border-top:1px solid #ddd;
    border-bottom:1px solid #ddd; width:100%;
    }
    </style>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
    <script src='http://dl.dropbox.com/u/29281608/JS%20Dosyalar%C4%B1/fluidtextresizer.js' type='text/javascript'>
    </script>
    <script type='text/javascript'>
    var mytextsizer=new fluidtextresizer({
    controlsdiv: &quot;sizecontroldiv&quot;, //id of special div containing your resize controls. Enter &quot;&quot; if not defined
    targets: [&quot;body&quot;], //target elements to resize text within: [&quot;selector1&quot;, &quot;selector2&quot;, etc]
    levels: 10, //number of levels users can magnify (or shrink) text
    persist: &quot;session&quot;, //enter &quot;session&quot; or &quot;none&quot;
    animate: 200 //animation duration of text resize. Enter 0 to disable
    })
    </script>

    Kod içnde bulunan fluidtextresizer.js adlı dosya şurada barındırılmaktadır. Dilerseniz güvendiğiniz yada sahip olduğunuz bir hosta yükleyebilirsiniz.

    Bu işlemlerin ardından aşağıdaki kodu buluyoruz.

    <data:post.body/>

    ve hemen üstüne veya öncesine aşağıdaki kodları ekliyoruz.

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div id='mbt-text-resizer-container'>
    <div class='controlstyle' id='sizecontroldiv'>
    <font style='color:#666; font-weight:bold;'>Yaz%u0131 boyutu:</font> <a class='mbt-text-resizer' href='#smaller'><img src='http://2.bp.blogspot.com/-hcriotbuHqQ/TprlX1VeBII/AAAAAAAAFRA/h331qxRqqxo/s400/oranged.png'/>&#160;</a> <a class='mbt-text-resizer' href='#bigger'><img src='http://3.bp.blogspot.com/-ZCdAqxALWFQ/TprlYKwK4QI/AAAAAAAAFRI/YBkNpOf3AHo/s400/orangei.png'/>&#160;&#160;</a><a class='mbt-text-resizer' href='javascript:mytextsizer.setFontLevel(0)' rel='nofollow'>Reset &#8597;</a>
    </div>
    </div>
    </b:if>

    Kod içinde Yazı boyutu: yazan kısmı kendinize göre düzenleyebilirsiniz. Ardından temamızdaki Değişikleri Kaydedip çıkabiliriz. İşlemimizbitmiştir. Hayırlı uğurlu olsuni kolay gelsin, kalın sağlıcakla 🙂

    Rate this post

    Paylaş

    3 Cevaplar

    1. ibrahim karalar dedi ki:

      Dostum sitene daha önce göz atmıştım Birde google reklamlarında görünce ayrıca bu kodları arayınca ve sende bulunca yorumda yapasım geldi hadi hayırlı işler kodlara bakim olur inşallah 🙂

    2. ibrahim karalar dedi ki:

      Dostum çalışmadı kodlar bi göz at güncellesene bakayım yine 🙂

    3. Furkan ÖZDEN dedi ki:

      Hocam bir iki kere daha deneyin. Ben 3 kere denemiştim bu yazıyı yazmadan önce üçünde de çalıştı.

    Bir yanıt yazın

    E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

    Bunlar da hoşunuza gidebilir...