Skip to content
Grav 2.0 is officially stable. Read the announcement →
Archive

Grav loop: can't use .gif files as title-images. Only jpg

Started by Muut Archive 11 years ago · 7 replies · 774 views
11 years ago

Dear coders,

i am working on a portfolio site, which has both .gif and .jpg-files as title images to show on the portfolio overview. As you can see, my loop does not provide a possibility to use .gif-files, only .jpgs.
Is there a good workaround to fix this?

{% for child in collection %}
<div class="col-md-4 projekt">
<a href="{{ child.url }}" data-title="{{ child.title }}">

<img src="{{ child.media['title.jpg'].url }}">

</a>
</div>
{% endfor %}

Thank you guys!!! btw: Grav is amazing!

Tim

11 years ago

Define images inside your loop and then just call the image.url no matter what filetype it is. Here's a simplified example from one of my template files which always shows the first image of a portfolio page on an overview page:

TWIG
{% for child in collection %}
<figure>
   {% set image = child.media.images|first %}
   <img src="{{ image.quality(70).url }}" />
   <figcaption>{{ child.title }}</figcaption>
</figure>

Hope this helps…

11 years ago

Hi sebbb, thank you very much for your replay! Well, your code works anyway, but bizzarely it still ignores my title.gif. :-( Hmm....
Here's an idea:
Is there a way to write
<img src="{{ child.media['title.jpg'].url }}">
with a neutral datatype?

Or another one:

Is there a way to ask, if there's a title.gif or a title.jpg for each project?

11 years ago

As I wrote before: just use image.url without ['title.jpg'] to deliver images independent of their datatype. i just tried myself but it seems to ignore GIF files. It works fine with PNG and JPEG. I'll have another look at the docs but I'm afraid gifs wont work. :(

11 years ago

Ok looks like I found something. If you have a look at system/config/media.yaml you can see that gif files don't have the filetype image. They are listed as type: animated. That's why they aren't displayed when looping through images.

You could change the filetype of gif to type: imagein your own user/config/media.yaml to get it working, but I'm not quite sure if that's the right way to go.

10 years ago

I'm also trying to implement this on a page where I need to randomize the image shown from a folder containing both jpegs and animated gifs. I am using

TXT
page.find('/imgfolder').media.images|randomize|first

and while Jpegs work flawlessly, gifs are ignored. I tried changing the filetype in

TXT
system/config/media.yaml

as sebbb suggested. This allows gifs to show up but they are static. It seems to me there's not a way to include different kind of media in the same loop.

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1350 9 years ago
Archive · by Muut Archive, 9 years ago
2 935 9 years ago
Archive · by Muut Archive, 9 years ago
2 4061 9 years ago
Archive · by Muut Archive, 9 years ago
1 2948 9 years ago
Archive · by Muut Archive, 9 years ago
3 1119 9 years ago