View on GitHub

Typography

Beautiful typesetting without the work.

Download this project as a .zip file Download this project as a tar.gz file

Why Typography Matters

Proper typesetting can help increase reader retention and understanding, because text flows better and is easier to folllow. While the differences it applies to your may seem subtle, pedantic or even petty, they can in fact make a difference.

There is unlimited content on the web. Typography aims to make yours more impactful.

Who is Typography For?

Do you write content for the web? Chances are Typography is for you. Mac user borrowing a PC to finish an article or think two spaces should follow periods? Typography is definitely for you!

Even if you know the “typographically correct” keyboard shortcuts, it’s easy to miss a foot-mark (') when you meant to make a word possessive with an apostrophe (’). Then there are double-spaces, copyright signs, emdashes, endashes, and more … (see what I did there?).

If you have never considered typesetting or don’t have time to learn the rules—but care about content readibility—Typography adds a tiny bit of extra polish.

How Typography Works

Typography is a MODX output filter you can be apply to any field, including Template Variables. For example, applying it to the main content field is straightforward. In your templates, find the content field which looks like the following:

[[*content]]

And then add the output filter to it:

[[*content:typography]]

What Typography Does

Typography uses a slighty-tweaked [PHP SmartyPants](https://michelf.ca/projects/php-smartypants/) library by Michel Fortin to make content prettier as MODX pages render. Because it is an output filter, it doesn’t actually change your content.

To install Typography, use the MODX Package Manager from inside your MODX installation. You can also manually install it by creating a Snippet named “typography“ and copying and pasting the contents of one of the downloadable files in the header into the Snippet content field.

Text Replacements

Typography can perform the following transformations:

Typography does not modify characters within <pre>, <code>, <kbd>, or <script> tag blocks. Typically, these tags are used to display text where smart quotes and other “smart punctuation” would not be appropriate, such as source code or example markup.

Inch and Foot Marks

When using Typography but you need inch or foot marks (single- or double-quotes) to indicate measurements or latitude/longitude readings, you must escape them with a backslash character (\).

Leading Single-quote Characters

Paraphrased from the author of the originating author:

A situation in which quotes will get curled the wrong way is when apostrophes are used at the start of leading contractions. For example:

    'Twas the night before Christmas.

In this case, Typography will turn the apostrophe into an opening single-quote, when it should be a closing one. This problem cannot be easily solved in the general case. In fact, virtually every word processor gets this wrong, too. To work around this use the proper HTML entity for closing single-quotes (&#8217; or &rsquo;) by hand, or use keyboard shortcuts such as shift+opt+] on Macs.

Bugs and Feature Requests

Having trouble with Typography or have an idea to make it better? Check out its Github project at https://github.com/rthrash/typography.