// decoding html characters
// i.e. à => à
text = he.decode(text);
Richtypo: HTML typography enhancer for Node
Richtypo adds non-breaking spaces in the right places, <nobr>
and <abbr>
tags and wraps ampersands with a CSS class for special styling. It expects that your texts already have the right quotes, em-dashes and other symbols (you can use Typography Keyboard Layout).
Features
- Rules for English and Russian languages
- Non-breaking spaces after prepositions and conjunctions, before em-dash, etc.
<nobr>
for words with hyphens- CSS classes for ampersands
<abbr>
for abbreviations- Takes care of your HTML tags
- Simple typographer (quotes, em-dash, etc.) for user generated content (like comments)
- No dependencies
Example
const richtypo = ;const beautiful = richtypo;const awesome = richtypotitle 'Beautiful & Awesome Web Typography with “Richtypo”';const ok = richtypo;
Will produce something like that:
Welcome to the world of beautiful web typography — only with Richtypo.Beautiful & Awesome Web Typography with “Richtypo”'“Richtypo” — awesome!
Note: all methods render
as an actual non-breaking space (\xA0
).
Also look at the example page and its source.
Styles
Richtypo wraps abbreviations in <abbr>
tags. It also wraps ampersands and leading quotes to allow custom styling:
Character | Spacer class | Character class |
---|---|---|
& |
.amp |
Start with something like this and customize it for your site:
/* Use small caps for abbreviations */ /* Use the best available ampersand */
Installation
$ npm install --save richtypo
JavaScript API
Text processing: common use cases
richtypo; // Enhancing typography: non-breaking spaces, abbreviationsrichtypotitletext lang; // Typography for big text: the same as rich and ampersandsrichtypo; // Simple typographer (quotes, em-dash, etc.) for user generated content (e.g. comments)richtypo; // lite() + rich()
text
is an HTML string;lang
(optional) is a text language (en
orru
, default:en
).
Text processing: custom set of rules
richtypo;
text
is a HTML string;rulesets
is array of rulesets (available rulesets:save_tags
,cleanup_before
,short_words
,orphans
,lite
,rich
,cleanup_after
,restore_tags
,remove_doppelgangers
or language-specific rules);lang
(optional) is a text language (en
orru
, default:en
).
Change language globally
richtypolanglang;
lang
is a language (en
orru
).
Convert to text
If you don’t want HTML tags in the result string, use textify
method:
richtypo;
Change log
The change log can be found on the Releases page.
License
The MIT License, see the included License.md file.