DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:fontface

FontFace Plugin

Compatible with DokuWiki

  • 2014-09-29 "Hrun" yes
  • 2014-05-05 "Ponder Stibbons" yes
  • 2013-12-08 "Binky" yes
  • 2013-05-10 "Weatherwax" yes

plugin Embed fonts (via uploaded fonts or Google Fonts)

Last updated on
2015-04-05
Provides
Action
Repository
Source

Tagged with fonts, style, typography

Installation

Install the plugin using the Plugin Manager and the download URL above, which points to latest version of the plugin. Refer to Plugins on how to install plugins manually.

:!: External requirements: If your not using a Google Font, then the used font needs to be uploaded into the plugin's “./fonts/“ directory first.

To help you decide on the technique, see Comparison of web fonts solutions on SocialCompare.com

Uploaded fonts (@font-face)

You need to upload at least two files into the plugin's “fonts” directory to accommodate the majority of all the different browsers:

  • <fontFile>.ttf
  • <fontFile>.woff

Optionally you can also add:

  • <fontFile>.eot
  • <fontFile>.svg
  • <fontFile>.woff2

Here you will find ready-made font packages which will already contain all four of them: http://www.fontsquirrel.com/fontface

Google Fonts

You don't need to upload any files. You can use any of the fonts listed here: http://www.google.com/webfonts

You can add variants into the “fontFile” option, e.g. 'Expletus+Sans:regular,bold'.

Configuration and Settings

  • technique: Font embedding technique, with a choice of 'fontface' (Uploaded fonts) and 'google' (Google Fonts)
  • fontFile: Font file name (for uploaded fonts: without extension; for Google fonts: what comes after ”?family=”, see instructions)
  • fontName: Font name (as used in CSS)
  • elements: For which elements should the font be used? (comma separated, not needed when font is used in other CSS files)
  • genericFamily: Generic font family (serif, sans-serif, monospace, cursive, fantasy)
  • fontFile2: Second font file name
  • fontName2: Second font name
  • elements2: For which elements should the second font be used?
  • genericFamily2: Second generic font family

Development

Change Log

Known Bugs and Issues & ToDo/Wish List

Have a look at bugs, feature requests and ToDos in the bug tracker.

Discussion

Before reporting any issues (bugs or requests), please first take a look at the FAQ on plugin problems.

You can report any issues either on the Issue Tracker or here in this section.


Having some trouble getting this working 100% with Google Ubuntu font. These are my settings:
Google Font API
fontFile: <link href='http://fonts.googleapis.com/css?family=Ubuntu:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
fontName: font-family: 'Ubuntu', sans-serif;
headings: h1 only checked
addStyles: checked
genericFamily: sans-serif

The font appears on the site, but bold and italic do not work. It's probably something simple in the setup that I'm missing but I can't see what it is. Suggestion?

The settings should be the following instead:
fontFile: Ubuntu:400,400italic,700,700italic
fontName: Ubuntu
Anika HenkeAnika Henke
ach

London, UK
2011/08/06 12:46
I have now clarified the config options in the config manager (and on this page). — Anika HenkeAnika Henke
ach

London, UK
2015-04-05 15:33

How can i use https://fonts.googleapis.com/earlyaccess/scheherazade.css

Early access Google fonts are currently not supported, sorry. You could add it yourself to the meta.html file (if your template supports that). — Anika HenkeAnika Henke
ach

London, UK
2015-04-05 15:33
plugin/fontface.txt · Last modified: 2015-04-05 15:44 by ach