professionalwiki / fontawesome

Allows to insert Font Awesome Free icons in page

FontAwesome

The FontAwesome extension to MediaWiki provides parser functions to insert Font Awesome Free icons into the wiki text.

Currently Font Awesome Free, version 6.2.1 is included.

Requirements

• PHP 7.4.3 or later
• MediaWiki 1.35 or later

Installation

Using Composer

Using Composer is the recommended way to install this extension.

Run the following commands from the MediaWiki installation directory:

1. COMPOSER=composer.local.json php composer.phar require --no-update mediawiki/font-awesome ^2.0
2. php composer.phar update --no-dev mediawiki/font-awesome

To update the extension run the last command again.

Using a download from GitHub

1. Download a tar ball or zip file from GitHub
2. Extract it into the extensions directory of your MediaWiki installation
3. Rename the folder FontAwesome-... to FontAwesome

To update the extension delete the FontAwesome folder completely and re-install.

Activation

Add the following line to your LocalSettings.php:

wfLoadExtension( 'FontAwesome' );

Configuration

There are two render modes available for FontAwesome icons:

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

The render mode can be selected by setting the variable $wgFaRenderMode in LocalSettings.php. 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

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}} will insert the Wikipedia-W

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

Professional Support

The FontAwesome extension is maintained by Professional Wiki. You can contract us to help you with installation or customization of FontAwesome. We also do development work.

License

GNU General Public License, Version 3 or later.

The Font Awesome Free package is included in the extension. See its license file for details.

Release notes

Version 2.0.0

Released on January 27, 2023.

• Raised minimum PHP version from 7.0 to 7.4.3
• Raised minimum MediaWiki version from 1.31 to 1.35
• Updated to FontAwesome 6

Version 1.1.0

Released on January 25, 2023.

• Updated FontAwesome to 5.15.4

Version 1.0.0

Released on October 20, 2019.

• Initial release

fontawesome's Issues

Upgrade to FontAwesome 5.15.4

This is the latest FA 5.x version.

To be done in a 1.x release of this extension, before doing #8.

Compatibility with MobileFrontend and MinervaNeue

Hello,

I'm quite new to MediaWiki, and I'm currently trying to set up a wiki.
I installed the FontAwesome extension, using Composer, and it works fine on my main Wiki style (Vector). But I also have the MobileFrontend extension installed with MinervaNeue skin. And on the mobile version of the wiki, the icons are not showing up...
Am I doing something wrong, or is there an issue somewhere ?
I've tried both renderers without any change.

You can check an exemple of an icon use on this page on my wiki : https://wiki.penspinning-france.fr/Modèle:Information (click "Version mobile" on the bottom of the page to switch to mobile display and see the icon vanish).

The additionnal configuration I have in my LocalSettings.php is as follows :

wfLoadSkin( 'MinervaNeue' );
wfLoadExtension( 'MobileFrontend' );
$wgMinervaAlwaysShowLanguageButton = false;

wfLoadExtension( 'Scribunto' );
$wgScribuntoDefaultEngine = 'luastandalone';

$wgGroupPermissions['sysop']['deletelogentry'] = true;
$wgGroupPermissions['sysop']['deleterevision'] = true;

$wgFileExtensions[] = 'svg';
$wgSVGConverter = 'ImageMagick';

wfLoadExtension( 'ParserFunctions' );

$wgFavicon = "$wgResourceBasePath/resources/assets/logo_120x120.png";

$wgCategoryCollation = "uca-fr";

wfLoadExtension( 'Cite' );

wfLoadExtension( 'FontAwesome' );

Thanks for your help!

Possible to config used icons for smaller import?

I'm not sure the scope of this request so feel free to ignore if it's too much work - I use a lot of FontAwesome on my wiki but only a couple total icons. If possible I'd prefer to only make users load the icons I actually use. When searching for ways to do this I found this repo - https://github.com/johnsmclay/icnfnt. Currently I'm not using this extension and instead I just add icons via ::before and ::after pseudoelements but if I could import fewer total glyphs I'd definitely switch all my usage to this extension.

I'd ideally prefer to specify imported glyphs via a mediawiki-namespace or have the extension track usage from the parser function in an internal table, but doing it via a localsetting would also work fine (in my particular use case on Gamepedia I need someone with higher privileges to update localsettings changes, and it would be nice to not require this for any wikis with admins without backend access in general, but it's probably significantly easier to do via a localsetting and that tradeoff is probably worth it).

Also if you know of a non-extension way to achieve this with just css let me know!

Add FontAwesome 6 support

From https://www.mediawiki.org/wiki/Topic:Wti2hwqts6wfok61

---

This should be done as part of a new major version of this extension and will most likely involve replacing FA 5.x, not supporting both.

Add screen reader support

From https://www.mediawiki.org/wiki/Topic:Wogv8rqdnhb1lc5n

Is there a recommended way to make an icon from this extension accessible to people using screen readers, so that it reads some text instead of ignoring the icon? This is probably a question with a very simple answer so apologies in advance!

Cleanup and modernize

• Run CI on GitHub Actions
• Raise PHP requirement
• Raise MediaWiki requirement
• Fix any PHP deprecations caused by newer versions of MW

To be done before #8.

Colors and fontsíze

At the moment i the icons are black. Is it possible to colorize them and adjust the size as with the ckeditor-FA-plugins . At the moment i prefer to load the Fa-all.css from the web which allows that.

brand icons missing

I tried {{#fab:wikipedia-w}} or {{#fab:google}} but they did not show up in my present version (1.0). (https://www.univie.ac.at/rel_jap/an/Spezial:Version)

Other icons such as {{#fas:Times}} do work.

Files for fonts (extenstions/FontAwesome/.../webfonts/fa-brands-400-eot etc.) seem to be present though.

See: https://www.univie.ac.at/rel_jap/an/Metalog:Sandkiste

Ref: https://www.mediawiki.org/wiki/Topic:Vqk4miw736ggtjwn