Although the Gutenberg editor recognized and uses the FSE templates,
on frontend the index.php is still used instead.
Is there a route/router/loader that has to be reconfigured so it doesn’t short-circuit the template and allows WordPress to use the FSE templates instead?
The template_includefilter workaround doesn’t work and doesn’t seem to fix the underlying issue.
So after further investigating this issue (I really want to use Sage 10 + Gutenberg Full Site Editing/FSE) I found out that the Sage provider thing that also does the blade template handling in the acorn library (that adds all the runtime logic to the Sage 10 theme) intercepts the template loading and always sets the blade template file.
In contrast, the Gutenberg Full Site Editing block-template logic will use classical theme template files only as a fallback if it can’t find a block-template/ template file.
Just disabling the Sage provider caused new trouble as it also disabled manifest support.
When I comment out these two lines in the SageServiceProvider.php file, the Gutengberg block templates finally load:
But this will disable the classic blade fallback templates - including WooCommerce pages that aren’t Full Site Editing/FSE aware yet (as I know).
So how can I change the priorities or logic in Sage 10 that Gutenberg Full Site Editing/FSE block-templates have precedence over the classic blade templates?
The WordPress core logic first looks for an existing classic template file, then tries to find a Gutenberg Full Site Editing/FSE block-template and uses that, otherwise falls back to the classic template file:
Issue (Gutenberg):
It is caused by the template_hierarchy related filters:
The get_query_template uses the "{$type}_template" filter at the end - which is then overridden by the aforementioned Sage class.
The filterTemplateHierarchy function always tries to lookup a blade template file for the passed $files array paths. This will also override block-template files.
This seems to fix it:
public function filterTemplateHierarchy($files)
{
return $files + [$this->sageFinder->locate($files)];
}
@strarsis I followed your notices about Sage and FSE here. Now I am wonderung what the current status on this is. Were you able to get Sage 10 as FSE-Template running?
Gutenberg and Sage had some changes in their loading behavior.
I had to adjust at least two times. Currently I had issues with latest Gutenberg (open basedir error on staging). As I also want to use FSE on production, I have to further debug this.
But with those adjustments FSE support in the theme should at least be detected in development.
Thanks for getting back to me. I understand that this is not production ready.
Would be great if you could keep us up to date on your findings. Would be great to use Sage with FSE.
+1 on this @strarsis please let us know if you have any luck with FSE, just starting to dip my toes in now! (I’ll post back if I find a useful workaround)
@slowrush: Alright, I prepared a new Sage 10 Full Site Editing (FSE) example project:
Explanations and instructions are in the README.
Usually the Sage 10 should be a hybrid FSE theme, with non-block templates used for classic/traditional/classic views (with Blade-PHP). This has to be tested to ensure the order of precedence of template files is correct:
Can a block template be overridden by a classic/Blade-PHP template?
Currently the classic/Blade-PHP templates are always overridden by existing block templates.
Hi @strarsis , I have been trying to use your Sage10 FSE -theme and it works wonderfully on the wp-admin side. However I am unable to use the blade-templates at all. Is this how the theme is supposed to work (.html templates work but the .blade.php ones dont)? For example, I have created a blade template called ‘Testi Blade Template’ and it shows in the WP-admin when creating a page, but when I select the template none of the blade-template code works. Would be much needed if I could use the php-syntax and blade code inside a page. (creating custom ACF blade blocks work however, but there is need on some pages to use for example header.blade.php or footer.blade.php instead of the Gutenberg template part).
Any advice? Thanks!
I also ran into this issue - an hybrid rendering did not work for me either in @strarsis theme repo.
I figured out, this was because of the overriden / patched method filterTemplateHierarchy in the used roots/acorn package:
public function filterTemplateHierarchy($files)
{
return $files + [$this->sageFinder->locate($files)];
}
Since $this->sageFinder->locate($files) returns an array, surrounding it with brackets, this method will return just the “default” array. So, any php / blade files won’t be located at all.
To fix this, I changed the method to:
public function filterTemplateHierarchy($files): array
{
$hierarchy = $this->sageFinder->locate($files);
// Extract all entries, which point to an official FSE path (e.g. templates/...)
$fse_paths = array_filter($hierarchy,
static fn ($file) => str_starts_with($file, 'templates/') || str_contains($file, 'templates/'));
$hierarchy = array_diff($hierarchy, $fse_paths);
// Build hierarchy with original $files and FSE paths on top.
return array_merge($files, $fse_paths, $hierarchy);
}
This will rebuild the found template files and will prio the FSE files above the blade template files.
I tried to get an optimized solution on this, by creating a acorn package, which should work on a vanilla sage theme and uses the original roots/acorn package. It also should check for required files in the theme. And it adresses an issue, where blocks won’t generate their CSS in wp_head().
Because this package is pretty WIP by now, please use with caution But eventually it’ll help you on this.