# Bundled images with markdown syntax in both editor and html

**URL:** <https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721>\
**Category:** support\
**Created:** [March 17, 2022, 7:47pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721 "2022-03-17T19:47:22Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![StefanoCecere](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/stefanocecere/32/12709_2.png) [@StefanoCecere](https://discourse.gohugo.io/u/StefanoCecere)\
**Post date:** [March 17, 2022, 7:47pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/1 "2022-03-17T19:47:22Z")

</div>

i need to have my markdown files working in “normal” markdown (vscode/obsidian) and rendered a html by HUGO.

BUT there is a problem with **standard links** to images in bundles. if i have these files:

```auto
/studio/_index.md
/studio/mypage.md
/studio/mypage2.md
/studio/image.jpg

```

i need to link the image in ‘mypage.md’ this works in editor but not in Hugo:  
`![](./image.jpg)` or `![](image.jpg)`

and this works in Hugo but not in editor  
`![](../image.jpg)`

some time ago i remember i was able to make it work with a custom hook image renderer

> <https://github.com/bep/portable-hugo-links/blob/master/layouts/_default/_markup/render-image.html>

but today (Hgo 0.94.2) it seems to not work ☹

i don’t know how to solve it… doesn’t anybody work with markdown in both ways?  
NB: i don’t want to use any shortcode, nor put images in /assets

---

<div class="post-metadata">

**Author:** ![pamubay](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/pamubay/32/17838_2.png) [@pamubay](https://discourse.gohugo.io/u/pamubay)\
**Post date:** [March 17, 2022, 8:03pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/2 "2022-03-17T20:03:01Z")

</div>

Your current structure, is **Not** _Page Bundle_:

```auto
studio/
├── image.jpg
└── mypage.md

```

Page bundle, in this case _Leaf Bundle_, the content file must be named `index.md`.

```auto
studio/
├── image.jpg # This image will be treated as Page Bundle Resources
└── index.md

```

---

<div class="post-metadata">

**Author:** ![StefanoCecere](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/stefanocecere/32/12709_2.png) [@StefanoCecere](https://discourse.gohugo.io/u/StefanoCecere)\
**Post date:** [March 17, 2022, 8:11pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/3 "2022-03-17T20:11:13Z")

</div>

arg… you are right!  
i have a \_index.md and then several other pages at the same level… i thought they were all page bundles.

this Page Bundles are really complicated (i have hundreads of pages ☹ and i can’t manage all of them as index.md in named directories…

---

<div class="post-metadata">

**Author:** ![kaushalmodi](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/kaushalmodi/32/2567_2.png) [@kaushalmodi](https://discourse.gohugo.io/u/kaushalmodi)\
**Post date:** [March 17, 2022, 10:19pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/4 "2022-03-17T22:19:55Z")

</div>

> [@StefanoCecere](#):
>
> have hundreads of pages ☹ and i can’t manage all of them as index.md in named directories

If you are worried about one-time conversion, it can be done easily with a bash or any language script.

---

<div class="post-metadata">

**Author:** ![StefanoCecere](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/stefanocecere/32/12709_2.png) [@StefanoCecere](https://discourse.gohugo.io/u/StefanoCecere)\
**Post date:** [March 17, 2022, 10:29pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/5 "2022-03-17T22:29:34Z")

</div>

no, it’s not coversion… it’s that i need to keep all notes in a readable way with standard and easy links.  
that’s why i don’t want to use many shortcodes

---

<div class="post-metadata">

**Author:** ![kaushalmodi](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/kaushalmodi/32/2567_2.png) [@kaushalmodi](https://discourse.gohugo.io/u/kaushalmodi)\
**Post date:** [March 17, 2022, 10:31pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/6 "2022-03-17T22:31:24Z")

</div>

> [@StefanoCecere](#):
>
> with standard and easy links

You can have that and also make Hugo builds work. But you’ll need to put in some time to understand the Hugo Module and Mounts features. Here’s a good example by bep: [GitHub - bep/portable-hugo-links: A test repo to test out the new Markdown Render Hooks in Hugo 0.62.0](https://github.com/bep/portable-hugo-links)

---

<div class="post-metadata">

**Author:** ![kaushalmodi](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/kaushalmodi/32/2567_2.png) [@kaushalmodi](https://discourse.gohugo.io/u/kaushalmodi)\
**Post date:** [March 17, 2022, 10:33pm UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/7 "2022-03-17T22:33:47Z")

</div>

> [@StefanoCecere](#):
>
> i can’t manage all of them as index.md in named directories

Resources can be in page bundles, yes.

But they can also be in a central `assets/` directory (directly or [after **mounting**](https://github.com/bep/portable-hugo-links/blob/aa096af0d46e5fc8126b0afaedac557470128cf1/config.toml#L24-L26)). That example link I pasted above should help you.

---

<div class="post-metadata">

**Author:** ![StefanoCecere](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/stefanocecere/32/12709_2.png) [@StefanoCecere](https://discourse.gohugo.io/u/StefanoCecere)\
**Post date:** [March 18, 2022, 7:36am UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/8 "2022-03-18T07:36:19Z")

</div>

yes i know /assets and as is wrote i can’t put all resources there, because each of my books in the /studio directory has to be compacted, with all its images there.

---

<div class="post-metadata">

**Author:** ![kaushalmodi](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/kaushalmodi/32/2567_2.png) [@kaushalmodi](https://discourse.gohugo.io/u/kaushalmodi)\
**Post date:** [March 18, 2022, 10:45am UTC](https://discourse.gohugo.io/t/bundled-images-with-markdown-syntax-in-both-editor-and-html/37721/9 "2022-03-18T10:45:41Z")

</div>

> [@StefanoCecere](#):
>
> i can’t put all resources there,

That’s where you use the mounting option. You don’t physically put the files in the assets dir.