diff --git a/INSTALLATION.md b/INSTALLATION.md
index 63d860b0..c3ab6e0e 100644
--- a/INSTALLATION.md
+++ b/INSTALLATION.md
@@ -1369,4 +1369,5 @@ define( 'CONSTANT_NAME', value );
| FICTIONEER_ENABLE_STORY_CHANGELOG | boolean | Whether changes to the story chapter list should be logged. Default `true`.
| FICTIONEER_ENABLE_BROWSER_NOTES | boolean | Whether to inform visitors of missing browser features. Default `true`.
| FICTIONEER_DEFER_SCRIPTS | boolean | Whether to defer scripts or load them in the footer. Default `true`.
+| FICTIONEER_ENABLE_ASYNC_ONLOAD_PATTERN | boolean | Whether the [onload pattern](https://www.filamentgroup.com/lab/load-css-simpler/) for asynchronous CSS loading is used. Default `true`.
| FICTIONEER_EXAMPLE_CHAPTER_ICONS | array | Collection of example Font Awesome icon class strings.
diff --git a/functions.php b/functions.php
index 4fd6de33..56e2a913 100644
--- a/functions.php
+++ b/functions.php
@@ -386,6 +386,11 @@ if ( ! defined( 'FICTIONEER_DEFER_SCRIPTS' ) ) {
define( 'FICTIONEER_DEFER_SCRIPTS', true );
}
+// Boolean: Asynchronous loading via onload pattern
+if ( ! defined( 'FICTIONEER_ENABLE_ASYNC_ONLOAD_PATTERN' ) ) {
+ define( 'FICTIONEER_ENABLE_ASYNC_ONLOAD_PATTERN', true );
+}
+
/*
* Arrays
*/
diff --git a/includes/functions/_theme_setup.php b/includes/functions/_theme_setup.php
index ce295bb2..55fa3313 100644
--- a/includes/functions/_theme_setup.php
+++ b/includes/functions/_theme_setup.php
@@ -1262,10 +1262,15 @@ if ( ! function_exists( 'fictioneer_output_head_fonts' ) ) {
// Critical path fonts
fictioneer_output_critical_fonts();
- // Bundled fonts
+ // Setup
$bundled_fonts = WP_CONTENT_DIR . '/themes/fictioneer/cache/bundled-fonts.css';
$last_built_timestamp = get_option( 'fictioneer_bundled_fonts_timestamp', '123456789' );
$cache_bust = "?timestamp={$last_built_timestamp}";
+ $loading_pattern = '';
+
+ if ( FICTIONEER_ENABLE_ASYNC_ONLOAD_PATTERN ) {
+ $loading_pattern = 'media="print" onload="this.media=\'all\'; this.onload=null;"';
+ }
// Create file if it does not exist
if ( ! file_exists( $bundled_fonts ) ) {
@@ -1279,9 +1284,9 @@ if ( ! function_exists( 'fictioneer_output_head_fonts' ) ) {
$custom_fonts_href = get_template_directory_uri() . '/cache/bundled-fonts.css' . $cache_bust;
// Start HTML ---> ?>
-
+ >
-
+ >
?>
-
+ >