How to Change Font Size onClick in WordPress with JavaScript

How to Change Font Size onClick in WordPress with JavaScript
Tisa Yeager

Have you ever come across a site or blog that lets their visitors change the font size from some +/- button in the sidebar? Normally, you should never have to add this feature because all major browsers have the zoom in/zoom out buttons, but there are still a good number of users who are not familiar with that zoom feature. Well in this article, we will show you how to give your users the ability change the font size in WordPress using a simple JavaScript function and some HTML.

Change Text Size On Click With JavaScript
Lillie Butler

Originally my default font had the size of 12 pixels (which is approximately 10 points, the standard size used in newspaper printing – I’m a retired journalist, that’s why). Most popular browsers use a 16 pixels letter as their default font. To decrease this to “my” 12, in my stylesheet I downgraded the body font to 75 percent. This downgrades “1em” from 16 to 12 pixels. Furthermore I changed all the pixel values for fonts used inside the body to em, so “12px” became “1em”, “10px” is now “0.835em” et cetera. Note that an a-link not having the href-attribute, does not automatically change the mouse cursor into a pointer!

Be the first to comment

Leave a Reply

Your email address will not be published.