Accessing image field in template

joe - 4 months ago

Not sure if I’m just being daft, but I’ve added a file as a field, uploaded an image and I’m trying to access it in a page type, but I can’t seen to get the right URL to the image.

The image resides in public/{project_name}/files-module/local/images

I’ve ben trying to get it out with < img src="{{ image_url("asset::" ~ page.banner_image.path()) }}" / >

ryanthompson - 4 months ago

You're super close - use the .make and .image (they're the same) to return an Image instance. From there you can use path / manipulate the image / etc.

In your case maybe just use the regular output which returns the tag.

{{ page.banner_image.make|raw }}

This returns this:

joe - 4 months ago

Thanks Ryan! Loving the PyroCMS 3.

As it generates the tag, how would I add a css class to it such as img-responsive for bootstrap?

ryanthompson - 4 months ago

Check out that Image class - it's chainable. Something like like this:

 {{ page.banner_image.make.class("foo").fit(100,100)|raw }}