I've set up an asset field inside a matrix field where a user can upload SVG icons, but I'm having trouble outputting them using the svg() function.

{# Correctly shows the path #}
{{ callout.icon[0].url }}

{# Correctly displays the SVG within an image tag #}
<img src = "{{ callout.icon[0].url }}" alt=""  />

{# No output #}
{{ svg(callout.icon[0].url) }}
{{ svg(callout.icon) }}

Can anyone see what I'm doing wrong with the svg() function? Other than being inside a matrix field, what I'm doing doesn't seem to differ from the example in the documentation. I'm trying to avoid using any plugins if at all possible.

  • Do you get any kind of error in the logs? Just out of interest have you tried using .one() instead of [0] i.e. {{ svg(callout.icon.one().url) }} – dmatthams Jun 24 '20 at 9:28
  • Just tried. Without svg() it correctly displays the path, but with svg() there's no ouput. Are the logs in /craft/stroates/logs/ ? If so, I checked there and searched all the .log.1, .log.2, .log.3 files, for "svg" but nothing came up – Jake1293 Jun 24 '20 at 13:07

Ok, think I know what's wrong – you want to select the first asset, but not its url. E.g.

{{ svg(callout.icon.one()) }}
  • Yes! That was it. Thank you so much :) – Jake1293 Jun 24 '20 at 13:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.