From 4ef893686ed9fc7a1f3110a5ed1f398072ace406 Mon Sep 17 00:00:00 2001 From: Niels Gouman Date: Wed, 8 Jan 2025 21:37:05 +0100 Subject: [PATCH 1/2] =?UTF-8?q?=E2=9C=A8=20feat:=20support=20disabling=20o?= =?UTF-8?q?f=20the=20font-subset=20in=20header?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config.toml | 1 + content/blog/mastering-tabi-settings/index.md | 4 ++-- templates/partials/header.html | 14 ++++++++------ 3 files changed, 11 insertions(+), 8 deletions(-) diff --git a/config.toml b/config.toml index ab6cab686..4409e458a 100644 --- a/config.toml +++ b/config.toml @@ -339,6 +339,7 @@ enable_csp = true # This avoids a flashing text issue in Firefox. # Please see https://welpo.github.io/tabi/blog/custom-font-subset/ to learn how to create this file. custom_subset = true +subset_enabled = true [extra.analytics] # Specify which analytics service you want to use. diff --git a/content/blog/mastering-tabi-settings/index.md b/content/blog/mastering-tabi-settings/index.md index b022d0aa7..442ee4622 100644 --- a/content/blog/mastering-tabi-settings/index.md +++ b/content/blog/mastering-tabi-settings/index.md @@ -720,9 +720,9 @@ See the [Mermaid documentation](@/blog/shortcodes/index.md#mermaid-diagrams) for |:----:|:-------:|:-------------:|:-----------------:|:-------------------:| | ❌ | ❌ | ✅ | ❌ | ❌ | -Custom fonts cause flashing text in Firefox. To amend this, tabi loads a subset of glyphs for the header. Since this (slightly) increases the initial load time, it's a good idea to try and minimise the size of this subset. +Custom fonts cause flashing text in Firefox. To amend this, tabi loads a subset of glyphs for the header. Since this (slightly) increases the initial load time, it's a good idea to try and minimise the size of this subset, or disable it completely if you're not using a custom font in your skin. -You can create a custom subset tailored to your site, save it as `static/custom_subset.css`, and have it load with `custom_subset = true`. +You can create a custom subset tailored to your site, save it as `static/custom_subset.css`, and have it load with `custom_subset = true`. Disabling the subset can be done with `subset_enabled = false`. For more information, including instructions on how to create a custom subset, see the [docs](@/blog/custom-font-subset/index.md). diff --git a/templates/partials/header.html b/templates/partials/header.html index e07bcd88f..70ef85863 100644 --- a/templates/partials/header.html +++ b/templates/partials/header.html @@ -36,12 +36,14 @@ {# CSS #} {# Load subset of glyphs for header. Avoids flashing issue in Firefox #} - {% if config.extra.custom_subset and config.extra.custom_subset == true %} - - {% elif lang == 'en' %} - - {% elif lang == 'es' %} - + {% if config.extra.subset_enabled %} + {% if config.extra.custom_subset == true %} + + {% elif lang == 'en' %} + + {% elif lang == 'es' %} + + {% endif %} {% endif %} {# Define array of CSS files to load. main.css is always loaded. #} From 9e8cf78df9936e28cf8aefa28537b6c6bb700238 Mon Sep 17 00:00:00 2001 From: Niels Gouman Date: Wed, 8 Jan 2025 21:37:05 +0100 Subject: [PATCH 2/2] =?UTF-8?q?=E2=9C=A8=20feat:=20support=20disabling=20o?= =?UTF-8?q?f=20the=20font-subset=20in=20header?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config.toml | 1 + content/blog/mastering-tabi-settings/index.md | 4 ++-- templates/partials/header.html | 14 ++++++++------ theme.toml | 1 + 4 files changed, 12 insertions(+), 8 deletions(-) diff --git a/config.toml b/config.toml index ab6cab686..4409e458a 100644 --- a/config.toml +++ b/config.toml @@ -339,6 +339,7 @@ enable_csp = true # This avoids a flashing text issue in Firefox. # Please see https://welpo.github.io/tabi/blog/custom-font-subset/ to learn how to create this file. custom_subset = true +subset_enabled = true [extra.analytics] # Specify which analytics service you want to use. diff --git a/content/blog/mastering-tabi-settings/index.md b/content/blog/mastering-tabi-settings/index.md index b022d0aa7..442ee4622 100644 --- a/content/blog/mastering-tabi-settings/index.md +++ b/content/blog/mastering-tabi-settings/index.md @@ -720,9 +720,9 @@ See the [Mermaid documentation](@/blog/shortcodes/index.md#mermaid-diagrams) for |:----:|:-------:|:-------------:|:-----------------:|:-------------------:| | ❌ | ❌ | ✅ | ❌ | ❌ | -Custom fonts cause flashing text in Firefox. To amend this, tabi loads a subset of glyphs for the header. Since this (slightly) increases the initial load time, it's a good idea to try and minimise the size of this subset. +Custom fonts cause flashing text in Firefox. To amend this, tabi loads a subset of glyphs for the header. Since this (slightly) increases the initial load time, it's a good idea to try and minimise the size of this subset, or disable it completely if you're not using a custom font in your skin. -You can create a custom subset tailored to your site, save it as `static/custom_subset.css`, and have it load with `custom_subset = true`. +You can create a custom subset tailored to your site, save it as `static/custom_subset.css`, and have it load with `custom_subset = true`. Disabling the subset can be done with `subset_enabled = false`. For more information, including instructions on how to create a custom subset, see the [docs](@/blog/custom-font-subset/index.md). diff --git a/templates/partials/header.html b/templates/partials/header.html index e07bcd88f..70ef85863 100644 --- a/templates/partials/header.html +++ b/templates/partials/header.html @@ -36,12 +36,14 @@ {# CSS #} {# Load subset of glyphs for header. Avoids flashing issue in Firefox #} - {% if config.extra.custom_subset and config.extra.custom_subset == true %} - - {% elif lang == 'en' %} - - {% elif lang == 'es' %} - + {% if config.extra.subset_enabled %} + {% if config.extra.custom_subset == true %} + + {% elif lang == 'en' %} + + {% elif lang == 'es' %} + + {% endif %} {% endif %} {# Define array of CSS files to load. main.css is always loaded. #} diff --git a/theme.toml b/theme.toml index 46db97fc0..f0b8a1345 100644 --- a/theme.toml +++ b/theme.toml @@ -296,6 +296,7 @@ enable_csp = true # This avoids a flashing text issue in Firefox. # Please see https://welpo.github.io/tabi/blog/custom-font-subset/ to learn how to create this file. # custom_subset = true +subset_enabled = true [extra.analytics] # Specify which analytics service you want to use.