KristofDM
KristofDM

Hey!

I've been wanting to use images is in my content sections. My file has the .htm suffix and according to the documentation that means that it's just evaluated as regular html.

Do expressions like this:

{{'assets/images/projects/coachcenter.png'|theme}} 

not work in content sections?

Kind regards, Kristof

mammouth
mammouth

Wondering the same thing myself - it does indeed not seem to work like this, but is that the expected behaviour or something odd?

Daniel81
Daniel81

I believe content sections are just that, content (text/html), they are for basic html and are not parsed by Twig, so the above code will not work.

mammouth
mammouth

Thank you Daniel81! The docs are a tad ambiguous about that, not specifying exactly where the |theme filter will be parsed, but it makes sense that content is just content... Rearranging the code around this, by calling the images from a partial, should do the trick, then.

Daniel81
Daniel81

Yeah, there shouldn't be any issues calling images etc in partials or layouts, they both parse Twig

Flynsarmy
Flynsarmy

If you want a WYSIWYG, you can install CKEditor plugin and go to Settings - CKEditor. Theres a checkbox to use it with Content Blocks.

creg33270
creg33270

However, sometimes it would be advantageous to have access to the assets (images) in a content block. Since nobody answered this question, here's a suggestion from me:

In a page

==
{% set myAssets = 'assets/images/'|theme %}
<div class="section">
    <div class="container">
        {% content "my-content.htm" path2assets=myAssets %}
    </div>
</div>

Access an image inside of my-content.htm

<div class="card-body" style="background-image: url('{path2assets}/bg22.jpg')">
</div>
eduardo33668
eduardo33668

I see this post is four years old, however, I ended up in here because of very same situation, struggling with the |theme filter not working within a content section.

However, what I've done to "get around it" was to simple use src paths as it is in html. For instance, let's say I have a theme called Bogus. Then, within the content html, I simply use src="themes/bogus/assets/images/the_right_one.jpg" where [assets/images/the_right_one.jpg] is whatever path I you to reach from a content section

I know this is not smart or even clever, but I get that sometimes we forget there's simple solutions like this. And even tho it's not meant to work like that, it solves the question if you want to use a img tag. Or else, you can just use the solution from creg33270.

Btw, running on a local server. If anyone is up to try it on a host it would be nice!

netgeek12355183
netgeek12355183

This does not work STILL... <code><img class="img-fluid" src="{{ 'assets/media/various/landing-promo-hero.png'|theme }}" srcset="{{ 'media/various/landing-promo-hero@2x.png'|theme }}" alt="Hero Promo"></code>

1-9 of 9