Share

ब्लोगर वेबसाइट में Font Resizer Feature कैसे जोड़ें – बस 3 कोड से

नमस्कार दोस्तों इस पोस्ट में हम ये जानेंगे की ब्लोगर वेबसाइट में Font Resizer Feature को कैसे जोड़ा जाए।

Font Resizer
Font Resizer

Font Resizer क्या है?

अगर आप इंटरनेट का प्रयोग करते हैं तो आप में से बहुत से लोगों ने ऐसा जरूर देखा होगा की कई वेबसाइट में एक फीचर होता है जिससे आप उस वेबसाइट पर पोस्ट किए हुए आर्टिकल का साइज काम या ज्यादा करके देख सकते हैं।

तो आप में से बहुत से ऐसे दोस्त होंगे जो ब्लॉगर का प्रयोग करते होंगे। तो हम ये जानेंगे की अपनी ब्लॉगर की वेबसाइट में Font Resizer ka फीचर कैसे जोड़ा जाएगा।

ब्लॉगर में Font Resizer फीचर जोड़ने के लिए:

  • सबसे पहले ब्लॉगर के डैशबोर्ड में जाएं
  • थीम में जाकर Edit HTML पर क्लिक करने
  • HTML कोडिंग में जाकर </body> search करे
  • और नीचे दिया कोड </body> के ऊपर Paste करदें।
<script>//<![CDATA[
$('').ready(function() { 
  $('#incfont').click(function(){    
        curSize= parseInt($('.post-body, .post-info').css('font-size')) + 2;
  if(curSize<=22)
        $('.post-body, .post-info').css('font-size', curSize);
        });  
  $('#decfont').click(function(){    
        curSize= parseInt($('.post-body, .post-info').css('font-size')) - 2;
  if(curSize>=12)
        $('.post-body, .post-info').css('font-size', curSize);
        }); 
 });
//]]></script>
  • ऊपर दिया गया कोड paste करने के बाद दूसरा कोड <body> के ऊपर paste कर दें
<b:if cond='data:view.isSingleItem'><div class='At-texresizer'><div class='text-A+' id='incfont'><b>A+</b></div><div class='text-A-' id='decfont'><b>A-</b></div></div></b:if>
  • दोनों कोड paste करने के बाद आखिर का कोड </head> के ऊपर paste करना है जो नीचे दिया गया है
<style>
  .At-texresizer { position: fixed; color: #ffffff; right: 30px; bottom: 180px; z-index:998;background-color:black; } #incfont, #decfont{font-size:18px;padding: 8px 10px; box-shadow: 0 0 40px 40px #e74c3c inset, 0 0 0 0 #e74c3c; box-sizing: border-box; background-color: transparent; border: 1px solid #fff;cursor: pointer;-webkit-transition: all 150ms ease-in-out; transition: all 150ms ease-in-out;}#incfont:hover, #decfont:hover { box-shadow: 0 0 10px 0 #e74c3c inset, 0 0 10px 4px #e74c3c;;margin-top: -2px; }
    </style>

सभी कोड को paste करने के बाद थीम को सेव कर दे। बस आपके ब्लॉगर मे Font Resizer ऑप्शन जुड़ चुका है।

अधिक समझने के लिए आप नीचे दी गयी विडियो देख सकते हैं।

आओ हिन्दी मे सीखें We would like to show you notifications for the latest news and updates.
Dismiss
Allow Notifications