failed to render shortcode "img-simple" about doks

[toudi]

sorry for necrobumping, but I've read the linked articles and I still do not understand how can I add images to posts (I'm receiving exactly the same error as the OP). what I've tried so far:

• editing images array inside _index.md
• adding resources section inside _index.md, like so:

resources:
- src: 'images/my-image.png'

• trying to place the image in the same directory as the .md file, without images subdirectory

basically my directory structure is exactly the same as cloning doks repository and I simply cannot build the page when I'm trying to place the image.

the change that I did is:

--- a/content/docs/prologue/introduction.md
+++ b/content/docs/prologue/introduction.md
@@ -5,7 +5,7 @@ lead: "Doks is a Hugo theme helping you build modern documentation websites that
 date: 2020-10-06T08:48:57+00:00
 lastmod: 2020-10-06T08:48:57+00:00
 draft: false
-images: []
+images: ["unnamed.png"]
+resources:
+  - "unnamed.png"
 menu:
   docs:
     parent: "prologue"
@@ -19,6 +19,8 @@ There are two main ways to get started with Doks:
 
 ### Tutorial
 
+{{< img-simple src="unnamed.png" >}}

(the image is placed inside content/docs/prologue directory.

would it be possible for you to provide a quick tutorial on adding images? I can see that this works in the minecraft demo page, though I can't even see where the images are referenced - they simply seem to be referenced trough img tag.

[toudi]

wow! it works like a charm. Thank you so much!

[h-enk]

Hey @alexvpickering, you need to use Page Bundles for the image shortcodes to work — see also Images.

You found a bug though 😉 I will update the hyas info command — it should be npm run check.

[alexvpickering]

Hey @alexvpickering, you need to use Page Bundles for the image shortcodes to work — see also Images.

You found a bug though 😉 I will update the hyas info command — it should be npm run check.

Ahhh okay great thank you! I had originally followed the Page Bundles link but it was too verbose for my state of mind so I assumed it was just a “go ahead and put images with you pages”. I’ll read the docs this time 😊

[h-enk]

Hello @toudi, the image shortcodes work for images that are page resources. Meaning, place your images in a page folder, like so:

..
├── prologue/
│   ├── _index.md
│   ├── commands.md
│   ├── introduction/
│   │   ├── index.md
│   │   └── unnamed.png
│   └── quick-start.md
..

That's it.