# A little confused about resize\_image in markdown with colocated assets

**URL:** <https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594>\
**Category:** Support\
**Created:** [January 9, 2023, 6:57pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594 "2023-01-09T18:57:04Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![cow](https://avatars.discourse-cdn.com/v4/letter/c/ce73a5/32.png) [@cow](https://zola.discourse.group/u/cow)\
**Post date:** [January 9, 2023, 6:57pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/1 "2023-01-09T18:57:04Z")

</div>

I’m a bit confused how to use resize image with colocated assets, and could use a helping hand. So far I can only seem to access static images

My directory structure is:

```auto
content
  hello-world
    images
      file.jpg
  index.md

```

In my markdown variables of `index.md`, I’ve added `assets = ["images"]`

In my markdown, I have tried:

```auto
{{ resize_image(path="/images/file.jpg", width=200, op="fit_width") }} /* this produces <img src=[object1]> and a broken image */
{{ resize_image(path=page.assets + "/images/file.jpg", width=200, op="fit_width") }}
{{ resize_image(path=page.assets["images"] + "file.jpg", width=200, op="fit_width") }}

```

In the latter 2 cases, the only thing that shows up on my actual rendered HTML is the literal shortcode text ike below:

 ![image](https://global.discourse-cdn.com/free1/uploads/zola1/original/1X/b44199e260db9aac5b15d5c0db2b4589cc1f5a31.png)

The only way I can load an image currently is `<img src="/images/file.jpg">` from the static directory.

The `resize_image` shortcode markup that I’m using (which comes from the theme I selected) is:

```auto
{% if not width %}
  {% set width = 240 %}
{% endif %}
{% if not height %}
  {% if width %}
    {% set height = width %}
  {% else %}
    {% set height = 180 %}
  {% endif %}
{% endif %}
{% if not op %}
  {% set op = 'fill' %}
{% endif %}

{% if caption %}
<figure>
  <a href="{{ get_url(path=path) }}"><img src="{{ resize_image(path=path, width=width, height=height, op=op) }}"/></a>
  <figcaption>{{ caption }}</figcaption>
</figure>
{% elif figure %}
<figure>
  <img src="{{ resize_image(path=path, width=width, height=height, op=op) }}"/>
</figure>
{% else %}
<img src="{{ resize_image(path=path, width=width, height=height, op=op) }}"/>
{% endif %}

```

The documentation gives an example for using page.assets for image galleries, but I’m having trouble getting page.assets working with the existing shortcode which takes a path.

I could rewrite the shortcode to access the files from page assets, but I’d like to try to get this working with the existing shortcode.

I could use a bit of help. Thanks!

---

<div class="post-metadata">

**Author:** ![keats](https://avatars.discourse-cdn.com/v4/letter/k/34f0e0/32.png) [@keats](https://zola.discourse.group/u/keats)\
**Post date:** [January 9, 2023, 8:46pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/2 "2023-01-09T20:46:02Z")

</div>

You can’t access variables or do any kind of operation (such as `+`) in the shortcode call , that’s why Zola is not recognizing the latter 2 as shortcodes.

The `resize_image` Tera function returns an object ([Image processing | Zola](https://www.getzola.org/documentation/content/image-processing/#image-processing-and-return-value)), not just the path to the processed image.  
You want to do something like `{% set data = resize_image(...) %}` and then `img src={{data.url}}`

---

<div class="post-metadata">

**Author:** ![cow](https://avatars.discourse-cdn.com/v4/letter/c/ce73a5/32.png) [@cow](https://zola.discourse.group/u/cow)\
**Post date:** [January 9, 2023, 9:05pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/3 "2023-01-09T21:05:27Z")

</div>

Thanks. That was actually the very first thing I tried, but I couldn’t use `{% ... %}` in my markdown, it wasn’t recognizing it and just renders the raw text in my html

I did see an example of this usage inside markdown [HERE](https://www.getzola.org/documentation/content/shortcodes/#shortcodes-with-body), but I don’t see an explanation on that page how to use it. Is there something I have to enable to make that work?

---

<div class="post-metadata">

**Author:** ![keats](https://avatars.discourse-cdn.com/v4/letter/k/34f0e0/32.png) [@keats](https://zola.discourse.group/u/keats)\
**Post date:** [January 10, 2023, 9:28pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/4 "2023-01-10T21:28:04Z")

</div>

Nothing special to use them, it just needs to look like a shortcode. If you are doing things like `{% resize_image(path=page.assets["images"] )`%}, the parser is not going to recognise that as a shortcode as it’s not valid.

---

<div class="post-metadata">

**Author:** ![cstrahan](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/cstrahan/32/1020_2.png) [@cstrahan](https://zola.discourse.group/u/cstrahan)\
**Post date:** [June 21, 2023, 10:53pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/5 "2023-06-21T22:53:36Z")

</div>

I’m still a bit confused. Does the general Tera syntax for e.g. `set`ing a variable not work within content?

For example, this renders as-is in my `content/pages/about.md`: `{% set me = resize_image(path="/img/me.jpeg") %}`

I’d like to resize an image directly within content, without having to introduce a _new_ shortcode… but maybe that’s not possible? Haven’t seen anything in the docs that describe this just yet, but I’ll keep poking around (I think this is what @cow meant when asking " Is there something I have to enable to make that work?").

---

<div class="post-metadata">

**Author:** ![cstrahan](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/cstrahan/32/1020_2.png) [@cstrahan](https://zola.discourse.group/u/cstrahan)\
**Post date:** [June 21, 2023, 10:58pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/6 "2023-06-21T22:58:18Z")

</div>

Judging by this closed issue (unless something has since changed) it looks like Tera is not allowed in content (only in templates): [Feature request: Support Tera in content · Issue #1207 · getzola/zola · GitHub](https://github.com/getzola/zola/issues/1207)

I haven’t read the documentation end-to-end, but I haven’t seen anything about that in the places I’d have expected to see it.

---

<div class="post-metadata">

**Author:** ![keats](https://avatars.discourse-cdn.com/v4/letter/k/34f0e0/32.png) [@keats](https://zola.discourse.group/u/keats)\
**Post date:** [June 22, 2023, 3:46pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/7 "2023-06-22T15:46:32Z")

</div>

Tera is never ran on the markdown content at all. The shortcodes are from a custom parser in Zola, they only look similar to Tera macros for ease of use. We should probably mention it in the shortcodes page though.

---

<div class="post-metadata">

**Author:** ![LunarEclipse](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/lunareclipse/32/1216_2.png) [@LunarEclipse](https://zola.discourse.group/u/LunarEclipse)\
**Post date:** [May 18, 2024, 10:34pm UTC](https://zola.discourse.group/t/a-little-confused-about-resize-image-in-markdown-with-colocated-assets/1594/8 "2024-05-18T22:34:50Z")

</div>

Hi, I posted a reply here [Resize images from a shortcode - #3 by LunarEclipse](https://zola.discourse.group/t/resize-images-from-a-shortcode/1583/3) that addresses the same problem as you seem to be having, if anything is unclear please ask!