31
WP-Plugin: jQuery Font Resizer
7 Comments | Posted by Devolux in WP Code, WP Plugins, jQuery
Description
The plugin offers three links to change the font-size of your blog. They can be inserted anywhere on your website by including a simple php-function (s. “Installation”). These links change the font-size value of the most outward html element of the page: the body element. All values of the elements inside the html body must therefore have relative font-size values. Only text that you want not to change its font-size at all must have an absolute value.
Here is an example for better understanding: The default font-size-value of the body element must be set to “10px” (s. “Installation”). By clicking the “A+”-link this value will be set to “11px”. All elements with RELATIVE font-size values (like “p {font-size: 100%;}”) will then be automatically adjusted to the new top-level font-size. In this case the font-size of a “p”-element will switch from 10px (100% of 10px = 10px) to 11px (100% of 11px = 11px). Font-size values of other elements will change likewise (a value of 120% will result in a new font-size of 13.2px).
IMPORTANT: Relative font-size values are calculated from the DIRECT parent element. This means: An element B which has a 100% font-size and which lays inside an element A that has a 120% font-size will have the font-size values of the element A (12px/13.2px), not the values calculated in proportion to the body element (10px/11px).
Installation
1. Upload the plugin to the “/wp-content/plugins/” directory.
2. Activate the plugin through the “Plugins” menu in WordPress.
3. Place “<?php resize_links(); ?>” in one of your templates to provide the resizing links on your website.
4. Go to your style.css file and assign a font-size of 10px to the body element of your website: “body {font-size: 10px;}”.
5. This is the most IMPORTANT step: All other font-size values in your stylesheets must be RELATIVE values (like “p {font-size: 100%;}”). Only elements with text that you want not to change its font-size at all must have an absolute value.
Frequently Asked Questions
Not yet available.
7 Comments for WP-Plugin: jQuery Font Resizer
Jan Broos | October 5, 2009 at 08:51
Marcel | October 18, 2009 at 13:35
Same at our site. Don’t work. Link: to smaller/bigger has #, nothing more.
Best, Marcel
Author comment by Devolux | October 18, 2009 at 16:37
I unfortunately have to say that the plug-in isn’t very stable yet. I didn’t have the time to have a look at it but I hope to get this done in the next time.
On the whole, the font resizing works very well, it it part of all my themes. For now, there’s the possibility to download one of these and see how it is done there.
20 Best Wordpress Typography Plugins To Enhance Readability | Wordpress | October 23, 2009 at 18:35
[...] jQuery Font Resizer [...]
20 Best Wordpress Typography Plugins To Enhance Readability | Lunch Time Laugh | October 25, 2009 at 10:04
[...] jQuery Font Resizer jQuery Font Resizer is a plugin that improves the usability and accessibility of your blog. It adds three links to each page to allow visitors to resize the type on that particular page. It’s a great option to make your site more user-friendly to visitors who want a larger or smaller type than standard. It’s known to work with WP version 2.0.2 up through 2.7. [...]
Nicole | November 24, 2009 at 20:59
Hi!
I love this text resizer…I can´t seem to find the download link for this particular plugin on your site. Is it still available?
Author comment by Devolux | November 25, 2009 at 17:38
Yes, it is. But it’s not working too well, so I suggest that you download my theme and take all necessary files from there.
I don’t get your plugin to work on my website, could you take a look what’s wrong?
http://www.dots-digits.nl
Kind regards