A little confused about resize_image in markdown with colocated assets

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:


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

In my markdown, I have tried:

{{ 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:

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:

{% 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 %}
  <a href="{{ get_url(path=path) }}"><img src="{{ resize_image(path=path, width=width, height=height, op=op) }}"/></a>
  <figcaption>{{ caption }}</figcaption>
{% elif figure %}
  <img src="{{ resize_image(path=path, width=width, height=height, op=op) }}"/>
{% 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!

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), not just the path to the processed image.
You want to do something like {% set data = resize_image(...) %} and then img src={{data.url}}

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, 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?

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.

I’m still a bit confused. Does the general Tera syntax for e.g. seting 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?").

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

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.

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.

Hi, I posted a reply here Resize images from a shortcode - #3 by LunarEclipse that addresses the same problem as you seem to be having, if anything is unclear please ask!