Jump to content

Extension:FontAwesome

From mediawiki.org

PW
The Professional Wiki team maintains this extension professionally.
Professional Wiki provides official support for MediaWiki LTS releases only. It may work with other MediaWiki releases.
MediaWiki extensions manual
FontAwesome
Release status: stable
Implementation Parser function , Skin
Description Provides parser functions to insert FontAwesome icons
Author(s) Stephan Gambke (F.trotttalk)
Maintainer(s) Professional Wiki
Latest version 2.0.0 (2023-01-27)
Compatibility policy For every MediaWiki release that is a Long Term Support release there is a corresponding branch in the extension.
MediaWiki 1.35+
PHP 7.4.3+
Database changes No
Composer mediawiki/font-awesome
License GNU General Public License 3.0 or later
Download
README
$wgFaRenderMode

The FontAwesome extension provides parser functions to insert Font Awesome Free (version 6.2.1) icons into the wiki text.

Installation[edit]

  • Download and place the file(s) in a directory called FontAwesome in your extensions/ folder.
  • Add the following code at the bottom of your LocalSettings.php file:
    wfLoadExtension( 'FontAwesome' );
    
  • Configure as required.
  • Yes Done – Navigate to Special:Version on your wiki to verify that the extension is successfully installed.

Configuration[edit]

There are two render modes available for FontAwesome icons:

  • Web Fonts with CSS: This default implementation uses web fonts as the file format and relies on the browser to render icons as it would any custom font (webfonts)
  • SVG with JavaScript: This implementation encodes icon data and the mechanism to display them in the browser in JavaScript code that the browser executes (javascript)

The render mode can be selected by setting the configuration parameter $wgFaRenderMode in your "LocalSettings.php" file. Allowed values are: webfonts (default) and javascript.

Example
$wgFaRenderMode = 'javascript';

For a discussion of the advantages and drawbacks of the render modes see Performance & Font Awesome on fontawesome.com.

Usage[edit]

This extension defines three parser functions:

  • {{#far:...}} to insert an icon from the FontAwesome Regular font
  • {{#fas:...}} to insert an icon from the FontAwesome Solid font
  • {{#fab:...}} to insert an icon from the FontAwesome Brands font
Example
{{#fab:wikipedia-w}}

This will insert the "Wikipedia-W" icon in your page.

For valid icon names see https://fontawesome.com/v6/search.

Additional classes can be added after the icon name.

Example
{{#fab:wikipedia-w fa-spin}}

This will insert a spinning "Wikipedia-W" icon in your page.

For Font Awesome specific classes see Style Cheatsheet

Font Awesome CSS Custom Properties can be used as properties for classes.

License[edit]

Extension

GNU General Public License 3.0 or later

Font Awesome Free

Various licenses