Full site editing/FSE: Frontend doesn't load template

@dsturm: Could you create a PR for this in the forked acorn repository, that Sage 10 FSE uses?

Edit: I just noticed that there is already a forked acorn with some FSE adjustments:
https://github.com/zirkeldesign/acorn-fse

Maybe that one should be required in Sage 10 FSE theme instead, until the adjustments were also merged into upstream roots/acorn?

Hej @strarsis,

the mentioned repo (GitHub - zirkeldesign/acorn-fse: A Roots Acorn package, to provide FSE compatibility for Sage 10.) is a separate acorn package, which will be installed parallel to the origin roots/acorn.

In this package, I tried to have a solution which support an unpatched acorn and uses Providers to remove the original template filters and sets the modified ones to support FSE and hybrid rendering.

Since it is WIP, it currently lacks some documentation and further testing.

Any tips on this? I replaced the filterTemplateHierarchy() -function content with your suggestion, but the blade -templates still are not working. If I dump the array using your code, I get the following:

image

Hej @talentreeweb,

so, what is your current frontend output?

I didn’t mentioned, that I also had to modify the patched filterTemplateInclude method and added a check, if an existing file is NOT a blade file:

public function filterTemplateInclude($file)
{
    if (@file_exists($file)
        && ! str_contains($file, '.blade.php')
    ) {
        return $file;
    }

    ...

Secondly, the filterTemplateHierarchy() method will prefer FSE template files over blade. So, if that does not fit you, you might change the array_merge().

Hi,
I edited the filterTemplateInclude -function as you suggested, but still no success. I have a page called ‘Sample page’ which uses the (blade) template template-test-blade.blade.php. The pages element gets the template:
image
In the blade -template file, I have:
image
But none of the h1 Elements are printed to the page in the frontend. It only shows the blocks I have added in the Gutenberg editor. When dumping the wp_die(var_dump(array_merge($files, $fse_paths, $hierarchy))); inside the filterTemplateHierarchy -function, it gives:

image

Also, if I just return the $hierarchy the template works, but the FSE templates do not work:
image
Page using blade template:
image
Page using FSE template, no styles here at all:
image

Custom templates didn’t work yet. But I think I found the solution:

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);

    // Extract all entries, which point to a custom blade template (e.g. template-foo.blade.php)
    $custom_template = get_page_template_slug();
    $custom_template_paths = [];
    if ($custom_template) {
        $custom_template_paths = array_filter($hierarchy,
            static fn ($file) => str_contains($file, $custom_template)
        );
        $hierarchy = array_diff($hierarchy, $custom_template_paths);
    }

    // Rebuild hierarchy with original $files and FSE paths on top.
    return array_merge($custom_template_paths, $files, $fse_paths, $hierarchy);
}

Could you test this? It worked for me with standard, custom FSE and custom blade templates.

Hi, Tested and it works! Thank you!

@dsturm: Related PR: Template hierarchy filter: Preserve existing paths by strarsis · Pull Request #141 · roots/acorn · GitHub
But that PR does not handle hybrid (Blade-PHP templates instead of FSE block templates) correctly.

It would be great if your acorn fork could be merged into upstream.

@strarsis I’d like to contribute / PR this. But I need to do some more modifications and tests, since I ran into some issues while using this with a standard sage install. :thinking:

1 Like

I have now opened a PR to merge the changes into roots/acorn:

2 Likes