I'm very new at Craft templating, and I can't seem to get an asset to link correctly in the browser.

{% block content %}
        <h1>{{ entry.title }}</h1>
        {{ siteUrl }}
        <p>Posted on {{ entry.postDate.format('F d, Y') }}</p>
        {{ entry.blog_body }}
        {% for asset in entry.blog_featured_image %}
            <img src="{{asset.url}}" alt="{{asset.title}}" />
        {% endfor %}
{% endblock %}

Becomes this:

  <h1>New Blog 1</h1>
  <p>Posted on January 15, 2017</p>
  <p>"Body Text"</p>
  <img src="{{ siteUrl }}assets/images/image.png" alt="title">

when output to a browser.

{{ siteUrl }} will display the path just fine, but when I'm using {{asset.url}} and it gets changed to {{siteUrl}} it doesn't create the path, it just stays at siteUrl. This is really confusing me.

Why doesn't {{ siteUrl }} return the base path when it's used in the asset.url?

  • 1
    In your asset settings for that source do you have something like {{ siteUrl }}/images in the input field? If so, try changing it to {siteUrl} and see if that helps. Jan 19 '17 at 17:16

What field type is blog_featured_image? Just an image asset? Does it work with

<img src="{{ asset.getUrl() }}" alt="{{asset.title}}" /> ?

  • The blog_featured_image is just an image asset.
    – FuzzyJelly
    Jan 20 '17 at 4:51
  • I attempted to use it within the ElementCriteriaModel doc (craftcms.com/docs/templating/craft.assets) but I couldn't get it to work. The base path and base url in the Settings > Assets are produced exactly (if I use {siteUrl} it outputs {siteUrl}assets/images rather than "example.com/assets/images" Unfortunately, using the same code you suggested didn't do it either. I'm missing something obvious, I'm sure, but I can't find it.
    – FuzzyJelly
    Jan 20 '17 at 4:57
  • How does your general.php look like? Maybe a typo there?
    – Andreas
    Jan 20 '17 at 8:22
  • There are no additional settings in general.php yet, I tried adding some siteUrl updates and have since removed them, so now it's empty. I realize now that it's the siteUrl that I added into the asset settings that's being passed through, so I think my question is answered and I need to research dynamic asset settings paths. Thank you!
    – FuzzyJelly
    Jan 20 '17 at 15:27

You need the .getUrl(); I also suggest that you have a look at the Imager plugin for a more flexible use of images in your site.

  • asset.getUrl() DOES get the url, but it omits the main base url (in this instance "localhost/public/" and leaves in {siteUrl} in the finished code: ( I.E. {{asset.getUrl()}} == "{siteUrl}assets/filename.jpg" )
    – FuzzyJelly
    Jan 20 '17 at 5:05

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.