إضافة أداة تكبير وتصغير الخط في مدونات بلوجر

تعمل الأداة على تكبير النص الموجود في المقالة فقط بعد تطبيق الشرح وكذلك على تصغير الخط أو إعادته إلى وضعه الإفتراضي

هذه الأداة موجودة في الكثير من المواقع العالمية الشهيرة مثل موقع RT عربي 

معاينة الأداة

إضافة أداة تكبير وتصغير الخط في مدونات بلوجر

الخطوة الأولى من لوحة تحكم المدونة أنتقل إلى المظهر أنقر على الرمز البرتقالي بجانب زر التخصيص ثم انقر على تعديل HTML 

الآن أبحث عن الرمز ]]></b:skin> ثم اضف الكود التالي فوقه مباشرةً

.rfopit{margin-top:10px;text-align:right}

#large{font-size:20px}

#reset{font-size:18px}

#small{font-size:16px}

الخطوة الثانية أبحث عن الرمز </head> وأضف الكود التالي فوقه مباشرةً

<script type='text/javascript'>

$(function(){

$(&#39;input&#39;).click(function(){

var ourText = $(&#39;.post-body&#39;);

var currFontSize = ourText.css(&#39;fontSize&#39;);

var finalNum = parseFloat(currFontSize, 10);

var stringEnding = currFontSize.slice(-2);

if(this.id == &#39;large&#39;) {

finalNum *= 1.1;

}

else if (this.id == &#39;small&#39;){

finalNum /=1.1;

}

else if (this.id == &#39;reset&#39;){

finalNum =16;

}

ourText.animate({fontSize: finalNum + stringEnding},500);

});

});

</script>

الخطوة الأخيرة ألصق الكود التالي في المكان الذي ترغب بأن تظهر فيه الأداة مثال لعرضه في جميع المشاركات يمكنك لصقه فوق الرمز <data:post.body/> لعرض الأداة في اعلى المواضيع أو اسفله لعرضها اسفل المقالات إذا لم يعمل جرب على كود آخر مثل <data:post.body/> لأنك ستجد أكثر من واحد مثله

    <div class='rfopit'>

<input id='large' title='تكبير الخط' type='button' value='أ+'/>

<input id='reset' title='افتراضي' type='button' value='أ'/>

<input id='small' title='تصغير الخط' type='button' value='أ-'/>

</div>