Problems when creating a custom block with twig as template engine

Kirby 4 Solved ✔️
1

Hello,
I try to recreate the card block example from More block examples | Kirby CMS. Different from the examples I want to use twig as my template egine for the block template. Instead of the card.php snippet I created a card.twig snippet under plugins/block-factory/snippets/blocks/card.twig.
In the index.php file of the plugin I configured it as follows:

<?php
Kirby::plugin('tvg/block-factory', [
    'blueprints' => [
        'blocks/card' => __DIR__ . '\blueprints\blocks\card.yml',
        // more blueprints
    ],
    'snippets' => [
        'blocks/card' => __DIR__ . '\snippets\blocks\card.twig',
        // more snippets
    ]
]);

I have configured the card block in a kirby layout and hence also have recreated the layouts.php template from the kirby maegazine example page as a layouts.twig. In layouts.twig I loop over the layouts and in every layout I then loop over the single blocks. I’m using the blocks() function as shown in layouts.php to render the block template. But when I try to open the page with a layout that contains a card block I receive a fatal error telling me
The "D:\IDE\tools\xampp\htdocs\tvg-kirby\site\plugins\block-factory\snippets\blocks\card.twig" directory does not exist ("D:\IDE\tools\xampp\htdocs\tvg-kirby\site\plugins\block-factory\snippets\blocks\card.twig").
This is the path to the template I configured in the index.php of the plugin. Why does he think that card.twig is a directory (which for sure doesn’t exist).
Am I doing something wrong or is it just not possible to use twig templates in custom blocks?

2

I guess you have tested that your twig block snippets work when present in the site/snippets/blocks folder?

A likely reason why they might not work when added as a plugin is the loading order of the plugins. The twig plugin needs to load first (plugins are loaded in the order they appear in the file system, i.e. alphabetically)

3

Good morning @texnixe, thank you for your quick reply. I have not tried putting the snippet in the site/snippets/blocks folder. How and where du I have to configure the snippet so that the card block can find it? Do I still need to configure the path to the twig template in the index.php file of the plugin?

4

Then please do so and report back if that works

5

This seems to work. I had to renove the mapping entry in the index.php file of the plugin completely however. So to recap what you said earlier. At least at the moment it is not possible to create a custom block with the help of a plugin, when I want to use twig as a template engine? How would I go and configure the panel part outside of a plugin? I mean the blueprint shouldn’t be the problem, but how do I configure the preview of the block in the template (the css and the vue template). Or should I keep the plugin for the index.js and index.css and only put the twig template outside of the plugin?

6

I think just making sure that the twig plugin gets loaded first (simplest way would be to rename the folder to for example 1_twig). Or you could use the system.loadplugins after hook system.loadPlugins:after | Kirby CMS

7

If I rename the plugin folder of the kirby-twig plugin to 1_kirby-twig the twig plugin isn’t working anymore. I receive the following error:

include(D:\IDE\tools\xampp\htdocs\tvg-kirby\vendor\composer/../../site/plugins/kirby-twig/src/classes/Template.php): Failed to open stream: No such file or directory

I installed the twig plugin via composer and somewhere the path to the old plugin must still be configured. Do you have any idea where to change that?

8

The do it the other way round and put the custom blocks at the end, starting with z_ or whatever

9

Thank you for yout patience. You really must think I’m stupid, but still it tells me

The "D:\IDE\tools\xampp\htdocs\tvg-kirby\site\plugins\z_block-factory\snippets\blocks\card.twig" directory does not exist ("D:\IDE\tools\xampp\htdocs\tvg-kirby\site\plugins\z_block-factory\snippets\blocks\card.twig").

But what I completely ignored the whole time is the fact that this is an error thrown by the FileSystemloader of twig. So twig is actually trying to load a template but somehow thinks that it is a folder and not a file.

10

I’ve finally found the solution. I had to change the backslashes in the snippet path in the plugins index.php to slashes.

<?php
Kirby::plugin('tvg/block-factory', [
    'blueprints' => [
        'blocks/card' => __DIR__ . '\blueprints\blocks\card.yml',
        // more blueprints
    ],
    'snippets' => [
        'blocks/card' => __DIR__ . '/snippets/blocks/card.twig',
        // more snippets
    ]
]);

Now, twig can load the card.twig template and everything works as expected.

11

Haha, totally overlooked that…