Linking to media file from template?

I’m trying to link to a file located in my theme assets folder from the base.html.twig template. I tried both of the below, but it can’t find the audio file I’m trying to link to.

{% if page.header.audio %}
<audio autoplay src="theme://static/audio{{ page.header.audio }}.mp3"></audio>
{% endif %}
{% if page.header.audio %}
<audio autoplay src="../../static/audio{{ page.header.audio }}.mp3"></audio>
{% endif %}

How would I use a relative link in the template file? If it helps, my theme directory structure looks like this:

static
– audio
– css
templates
– partials
– --base.html.twig

Hi @Alex, try

{% if page.header.audio %}
<audio autoplay src="{{ url('theme://static/audio #{page.header.audio}.mp3') }}"></audio>
{% endif %}

Basically, url is a special built-in function you can use to resolve several paths. Here theme:// is a stream. Grav has lot of streams predefined. You can find a few here and more here.

OK, that didn’t work, but I’ll look into streams. That gives me someplace to start. Does it need to be inside any blocks?

I know this works because I use it in the Antimatter partials/base.html.twig:

<link rel="icon" type="image/png" href="{{ url('theme://images/favicon.png') }}" />

So using the url() method for the theme:// stream does work. if that is not working then it’s because you need to concaat your string differently rather than next tags:

{% if page.header.audio %}
<audio autoplay src="{{ url('theme://static/audio/'~page.header.audio~'.mp3') }}"></audio>
{% endif %}

That should work now :slight_smile:

Thanks! That works great! :slight_smile: I’m still amazed by the support you guys provide for this CMS. By the way, once I get a handle on the Grav system a bit more I’d love to help put a few basic themes together.

Thanks Alex! and any themes would be greatly appreciated :slight_smile: