Error when building, can't find the template file, even though it's in the same directory

[phoopee3]

I'm trying to use your plugin, but I'm having a bit of trouble. I'm on Eleventy v2, node v20. When I do npm run serve it throws the following error:

[11ty]   EleventyShortcodeError: Error with Nunjucks shortcode `ogImage` (via Template render error)
[11ty] 3. Could not find file for the `ogImage` shortcode, looking for: ./og-post.njk (via Template render error)

This is even when the og-post.njk file is in the same directory as the template file being parsed.

The line in the template looks like this:

{% ogImage "./og-post.njk", { title: "Hello World!" } %}

I have tried without the ./ and that doesn't work either.

Any suggestions? Thanks in advance!

[KiwiKilian]

Just to be sure, you are using v2 of the plugin?

The inputPath of the template shall be specified relative to the root of your 11ty project. It's not possible to specify it relative to the template file in which you call the ogImage shortcode, because AFAIK I can't be sure from which file (page, layout, include) the shortCode is called. So given this project structure for example:

src/
├─ blog/
│  ├─ post.og.njk

The inputPath in the shorctode call should look like this, no matter where you are calling the shortcode from:

{% ogImage './src/blog/post.og.njk', { title: 'Hello World!' } %}

In v2 it's required to add the src/ prefix even if it's your 11ty inputDir. This will be fixed in v3, where it will be resolved relative to the inputDir. I hope this helps, otherwise please provide a minimal reproduction example.

If you didn't change plugins config inputFileGlob, I recommend sticking with the .og.njk file extension for the OG image templates. Otherwise you will end up with a HTML page generated from your OG image template.

[phoopee3]

ok I got it to work with this comment. thank you so much!