Typography

Plugin extends wiki markup to give wiki users ability to write beautiful text. There is sometimes some need for nice looking slogan, paragraphs of article or quotation. The best description of this plugin will be presentation I think.

Programming today is a race between software engineers striving to build bigger and better idiot-proof programs, and the Universe trying to produce bigger and better idiots.

So far, the Universe is winning.

Features & Constraints

Powers of Typography plugin are:

  • use your favourite font family
  • set small-caps variant on current chosen face
  • set text line height
  • manipulate spacing between letters and words
  • any order of parameters

As everything Typography plugin has it's strong and weak sides. Well, currently supported units are:

  • px – pixels
  • em – a unit of measurement in the field of typography, equal to the point size of the current font
  • ex – similiar in concept to em units, with difference that base size for font is it's small letter “x” size.
  • pt – points (per pixel), this setting depends od browser/printer dpi
  • % – percents

Pixel unit px does not allow you to use decimal part, so 20px is accepted but 20.5px is not.

Due to text-height css property handling when element has children in document tree, this sometimes can behave not as precise as you wish to.

Syntax

Whole syntax walks around <typo parameters>beatifull looking test</typo, where parameters syntax looks quite intuitive: name:value; (Have in mind there is no space after colon and do not forget about semicolon).

Adjusting font size

For example lets check font size 10 pixels and 10 points. Those are different, cause size based on points is browser/printer dpi dependent. For relative sizing you can use em units or percents. As you can observe 1.5em = 150%. Lets check how wiki markup looks like for that paragraph.

For example lets check font <typo fs:10px;>size 10 pixels</typo> and <typo fs:10pt;>10 points</typo>. Those are different, cause size based on points is browser/printer dpi dependent.
For relative sizing you can use <typo fs:1.5em;>em units</typo> or <typo fs:150%;>percents</typo>. As you can observe 1.5em = 150%. Lets check how wiki markup looks like for that paragraph.

Setting font family

Let's see this markup in action. Current paragraph should have Trebuchet MS font face choosen, if not found standard browser sans font will be used. Additionally you can specify smallcaps parameter right after tag name. You can use only smallcaps flag without specifing font family to smallcapsize default font face.

<typo ff:Trebuchet MS, sans;>Let's see this markup in action. Current paragraph should have **Trebuchet MS** font face choosen, if not found standard browser **sans** font will be used.</typo> <typo fv:smallcaps;> Additionally you can specify //smallcaps// parameter right after tag name.</typo> You can use only //smallcaps// flag without specifing font family to smallcapsize default font face.

Composition

To give you more power in typography on you wiki Typography text line height, letter spacing and word spacing setting is possible.

<typo lh:30px; ls:2px; ws:15px;>To give you more power in typography on you wiki [[typography|Typography]] text line height, letter spacing and word spacing setting is possible.</typo>

All-paramters sheet

functionality parameter syntax comment
font family <typo ff:Coma separated, font famliy names, can contain spaces;>Text</typo>
font variant <typo fv:smallcaps;>Text</typo> only “smallcaps” value allowed
font size <typo fs:20px;>Text</typo> values below zero not allowed
line height <typo lh:20px;>Text</typo> values below zero not allowed
letter spacing <typo ls:20px;>Text</typo> values below zero allowed
spacing between word <typo ws:20px;>Text</typo> values below zero allowed

Full-featured example

Let's see the code of quotation on top of page.

<typo fs:1.8em; ff:Iwona, Georgia, serif; ls:-2px; ws:-0.1em;>Programming today is <color #F0276E>a race between software engineers</color> striving to build bigger and better idiot-proof programs, <color #F0276E>and the Universe</color> trying to produce bigger and better idiots.</typo> <typo fs:1.8em; fv:smallcaps; lh:10px; ff:Iwona, Georgia, serif;>So far, the Universe is winning.</typo>

License

This software is provided as it is witout any warranty. Licensed on LGPL.

Download

Contact

Report bugs, suggest features or improvements directly to me.

Changelog

  • 2009/02/04
    • initial release
 
typography.txt · Last modified: 2010/02/08 09:55 by qentin
 
Except where otherwise noted, content on this wiki is licensed under the following license:CC Attribution-Noncommercial-Share Alike 3.0 Unported
Recent changes RSS feed Donate Powered by PHP Valid XHTML 1.0 Valid CSS Driven by DokuWiki