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.
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's image*/
border-bottom:4px solid darkred;
}
.mbt-text-resizer{
font-weight:bold; color:#F07727; text-decoration:none; font-family:arial,tahoma ; font-size:16px;
}
#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: "sizecontroldiv", //id of special div containing your resize controls. Enter "" if not defined
targets: ["body"], //target elements to resize text within: ["selector1", "selector2", etc]
levels: 10, //number of levels users can magnify (or shrink) text
persist: "session", //enter "session" or "none"
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 == "item"'>
<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'/> </a> <a class='mbt-text-resizer' href='#bigger'><img src='http://3.bp.blogspot.com/-ZCdAqxALWFQ/TprlYKwK4QI/AAAAAAAAFRI/YBkNpOf3AHo/s400/orangei.png'/>  </a><a class='mbt-text-resizer' href='javascript:mytextsizer.setFontLevel(0)' rel='nofollow'>Reset ↕</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 🙂
Canva, yeni başlayanlardan uzmanlara kadar uzanan dijital içerik oluşturucuların güzel tasarımlar oluşturabileceği bir platformdur. Bir…
Genel olarak, trafik seviyesinin aynı olduğu varsayıldığında, tek bir konu blogu çok nişli bir blogdan…
İster tek konulu bir blog, ister çok nişli bir blog yazmaya başlayacak olun, ele alacağınız…
Blog yazmanın tek gerçek maliyeti, bir alan adı kaydettirmek ve barındırma için ödeme yapmaktır. Maliyetler tek konu…
Pazarlama, hedef kitlenizi büyütmenize, trafiği artırmanıza ve içeriğinizi görmeyecek yeni okuyuculara ulaşmanıza yardımcı olur. Bir blog…
Artıları Bazı durumlarda içerik oluşturmak daha kolay ve daha hızlıdır - daha fazla içerik seçeneğiniz…