Alpha Release: 5.0.0-alpha2

Many fixes in #225

See release notes from Release 5.0.0-alpha1

Alpha Release: 5.0.0-alpha1

Overview

The big changes:

1. Improved block editor experience
2. Icon chooser performance improvements
3. Support for use without CDN dependence

This release introduces major changes to the block editing experience with Font Awesome. What you see is what you get (WYSIWYG)! Icons appear visually in the block editor just as they'll render on front end web pages. They can be styled and animated visually. They can be added as icon blocks, or as rich text within any rich text block--like paragraphs.

This version also introduces the possibility of loading without dependence on the Font Awesome CDN for front end page loads (the CDN is still used on the back end by admins and content creators). This may be preferable for users looking to avoid CDN usage as part of their GDPR-compliance, for example.

The icon chooser now queries the Font Awesome API service directly, instead of proxying through the WordPress server. This will avoid some lag and errors experienced by some users, and overall reduces the round trip request times.

The icon chooser also uses localStorage to cache queries, especially the initial query for kit metadata, which is required for loading the icon chooser modal. This results in a much snappier open event once cached. (However, it currently requires manual cache-clearing to get kit settings updates, including new custom icons.)

Install and Use

1. Download the font-awesome.zip attached to this release.
2. In WP Admin, select Plugins -> Add New Plugin in WP Admin.
3. Click "Upload Plugin" and choose the font-awesome.zip you just downloaded.
4. If you haven't already configured the plugin, go copy an API token from your fontawesome.com account. (It needs to have the "Read kits data" scope.)
5. In WP Admin, go into the Font Awesome plugin settings by clicking Settings on the plugin entry on the plugins page, or Settings -> Font Awesome from the side nav.
6. Choose "Use a Kit" and paste in your API token, if you haven't already.
7. Select a kit, if you haven't already.
8. Save changes.
9. Edit or create a new post using the block editor.
10. Add a block, select the "Font Awesome Icon" block.
11. Or create a paragraph block--after enter some content, click the Font Awesome icon on the rich text toolbar.
    

Skip Kit Loading

A new WordPress filter has been introduced for skipping the enqueue of the kit. Add this one line to your theme's functions.php, for example:

add_filter( 'font_awesome_skip_enqueue_kit', '__return_true' );

This is the first move to load frontend pages without dependence on the Font Awesome CDN.

Heads Up: <i> tags won't render when skipping kit loading

Another other consequence of not loading the kit is that there will be no <i> tag support, and thus, no [icon] shortcode support (shortcodes still just output <i> tags).

If you skip loading the kit, then <i> tags will not render.

Some users find that multiple versions of Font Awesome are being loaded by their theme or other plugins. Skipping this plugin's loading of the kit on frontend page loads won't block those other plugins from loading whatever they load. (Though you may be able to block them using this plugin's Troubleshoot tab). Thus, if they are already loading Font Awesome in a way that works for them, then this might be just what you want: while this plugin won't load a kit, if another plugin loads its own version of Font Awesome to use with its own <i> tags or CSS pseuo-elements (::before), then it should still work.

Self-host SVG styles

In the block editor, this plugin now inserts <svg> elements directly into the post content. This is the final markup and no other rendering is required on the server side or client side.

However, styling via CSS is still required.

By default, the plugin will load those styles from the Font Awesome CDN.

A new filter allows you to switch that to self-hosting. Set this in your functions.php, for example:

add_filter(
	'font_awesome_svg_styles_loading',
	function() {
		return 'selfhost';
	}
);

Valid values are "selfhost", "cdn", or false.

By default, this asset is not loaded when loading an SVG Kit, because that would result in the same SVG support styling being added twice.

If this filter is set to "selfhost", then when you save any Font Awesome plugin settings, during that save action, the plugin will retrieve the stylesheet from the Font Awesome CDN and place in a versioned directory wherever your wp_upload_dir() points to. For example:

wp-content/uploads/font-awesome/v6.6.0/css/svg-with-js.css

Remove CDN Dependence for frontend page loads

To remove CDN dependence for frontend page loads, filter font_awesome_skip_enqueue_kit to return true, and font_awesome_svg_styles_loading to return "selfhost". See above.

Clear Icon Chooser Cache to Get Custom Icon Updates

One of the performance improvements to the icon chooser is that the kit metadata query is cached in the browser's localStorage. That kit metadata query is necessary to power the icon chooser: it provides all of the info about your kit, including its version of Font Awesome, and any of its custom icons. Now, after the initial opening of the icon chooser for a given kit, subsequent opens of the icon chooser happen in the blink of an eye.

Most of the time, that seems best.

However, if you change the version of Font Awesome used by the kit, or add or change any custom icons, you'll need to clear that cache, and then just use the icon chooser again--it'll run a fresh query.

For this alpha release, clearing that cache is a manual process.

Open the browser's Dev Tools, locate its localStorage for your web domain, and find a value that starts with {"data":{"me":{"kit". Select and delete it. That's it!

For example, this screenshot shows what that looks like in a Chromium browser:

Outside the Block Editor

• Working with icons in the Classic Editor has not changed. The icon chooser still inserts a textual shortcode.
• See also the above not about <i> tags and shortcode not working when you skip kit loading.
• If you use another page editor other than the block editor--same thing--there are no relevant changes to your editing experience. You should not skip kit loading, because your editor's Font Awesome integration probably relies on either <i> tags or [icon] shortcodes working.

Breaking Changes

• Requires PHP 7.4 or newer.
• Requires WordPress 5.8 or newer.
• Deprecated v3 icon name usage in shortcodes has been removed.

Full Changelog: 4.4.0...5.0.0-alpha1

Release 4.4.0

• Update the Icon Chooser to fix the use of Sharp Solid in more recent versions of Font Awesome,
  and include Sharp Regular and Sharp Light.
• Add the "defer" attribute to script tags when in "Use a Kit" mode. This was already the behavior
  under "Use CDN" mode.
• Fix some deprecation notices for php 8.2.

Security Fix for Shortcodes

Escape attribute values in shortcodes.

Fix network creation: attempt 1

Addresses #183

Release 4.3.1

• Increase the timeout for network requests to API server
• Improve cleanup utility plugin

Release 4.3.0

• support Sharp Solid
• support WordPress multisite

Font Awesome Cleanup

The font-awesome-cleanup.zip file attached to this release is a utility plugin that can be installed to cleanup the WordPress database after any previous installations of this Font Awesome plugin.

This might be necessary in some tricky cases of downgrading to an earlier version of the plugin, or when installing a version of the plugin that supports multisite (like 4.3.0) after already having attempted to install a previous version of the plugin (say, 4.2.0) which was not compatible with multisite.

If you're running multisite, it's important that any installation of a previous plugin version is totally cleaned up before trying to install a this version or newer on multisite. Upgrading on multisite without cleaning up first will probably result in an error. A previous installation can usually be cleaned up by deactivating and uninstalling it. Uninstall must be done by clicking "Delete" on the deactivated plugin's entry in the plugin list in the admin dashboard. It may also work to install the previous 4.2.0 version and then uninstall it, just to get its cleanup code to run. But if that doesn't work, then this Font Awesome Cleanup plugin is your fallback tool.

To use it:

• download font-awesome-cleanup.zip from this page.
• deactivate the Font Awesome plugin in the WordPress admin dashboard
• install a new plugin, using the "Upload" option, and select the font-awesome-cleanup.zip file that you downloaded in the earlier step
• activate the Font Awesome Cleanup plugin, and then click "Go Cleanup"
• There'll be just one button to click to perform the cleanup, and then you're done

After the cleanup is done, you can proceed to install and activate the latest version of the Font Awesome plugin from the WordPress plugins directory.

Cleanup Scope

This "Font Awesome Cleanup" plugin can clean up either a single site, or the whole network of sites, based on its scope of activation. It requires that the Font Awesome plugin has already been deactivated.

If you activate this cleanup plugin network-wide, it will clean up all sites in the current network. If you activate it only on one site, it will clean up only that site. The scope of the cleanup is displayed on the settings page with the button that kicks off the cleaning process.

Most likely, you should install and activate it network-wide, and run the cleanup network-wide.

Release 4.2.0

• Make Font Awesome 6 the default version on new activations.
• On the version selection dropdown, distinguish between the latest 5.x and the latest 6.x.
• Maintenance updates to JavaScript dependencies.
• Developers: the latest_version() method has been deprecated and replaced by two alternatives:
  latest_version_5() and latest_version_6().

Multisite pre-release 4.3.0-1

To install this pre-release, download the attached font-awesome.zip and install in WordPress as plugin upload. It will upgrade an existing installation of the Font Awesome plugin.

The plugin may be activated network-wide, which creates separate configurations of Font Awesome for each child site, or it may be activated on individual sites.

Font Awesome Cleanup

So far in testing, the plugin works as expected for activation, deactivation, and uninstall, creating the appropriate entries in the WordPress database, and cleaning up after itself.

However, if you encounter problems, you can use the attached font-awesome-cleanup.zip plugin to thoroughly clean up, after deactivating Font Awesome, before doing a fresh installation.

This "Font Awesome Cleanup" plugin can clean up either a single site, or the whole network of sites, based on its scope of activation. It requires that the Font Awesome plugin has already been deactivated.

If you activate this cleanup plugin network-wide, it will clean up all sites in the current network. If you activate it only on one site, it will clean up only that site. The scope of the cleanup is displayed on the settings page with the button that kicks off the cleaning process. You can look at the source code to see how it's doing the cleaning here:
https://github.com/FortAwesome/wordpress-fontawesome/blob/multisite/integrations/plugins/font-awesome-cleanup/index.php#L126-L153

pre-release with multisite support

4.2.0-1

bump to pre-release for multisite