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

Lazyload image or how to setup custom data-src and classes with tiwg?

Started by Muut Archive 11 years ago · 2 replies · 704 views
11 years ago

It's currently not possible to change how the media is output. This is done by the Parsedown library that takes the markdown syntax and converts it into the appropriate HTML. Currently this code exists in the ParsedownGravTrait, specifically in the inlineImage() method.

You cannot currently modify this without messing with the system class directly. I am working on providing a solution to allow modifying the Parsedown functionality from a Grav plugin, but it requires a small change to Parsedown. I've submitted a PR and hopefully it will be accepted: https://github.com/erusev/parsedown/pull/373

11 years ago

Hey! I recently used lazysizes on a project. Here's some shortened code snippet form one of my templates.
-```
{% set images = page.media.images %}
{% for image in images %}
<figure class="col">
<img class="lazyload" data-src="{{ image.quality(75).url }}" />
</figure>
{% endfor %}

👍 1

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1352 9 years ago
Archive · by Muut Archive, 9 years ago
2 935 9 years ago
Archive · by Muut Archive, 9 years ago
2 4063 9 years ago
Archive · by Muut Archive, 9 years ago
1 2949 9 years ago
Archive · by Muut Archive, 9 years ago
3 1119 9 years ago