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

Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

Support

Display all image files in the user/images/gallery/subdirectory

Started by Norbert 5 years ago · 3 replies · 1166 views
5 years ago

Hello,
I am moving articles from Joomla 3 to Grav 1.7.

In Joomla, in the content of the article I have the plugin code: {gallery}/gallery/2021/28-09{/ gallery}.

The code loads all images from the given location.

In Grav, I would also like to replace it with code that will display these images (in the exported .md files, I add field: gallery: 'gallery/2021/28-09' to the item.md file, and delete string: {{gallery / 2021 / 28-09} }.

I copied all the images to the user / images directory and they are in their own subdirectories.

I don't know how to get all files in this location user/images/gallery/2021/ 28-09 in the .twig file.

Any idea how to get an array of these image files? Maybe you can generate such a gallery in some other way?

5 years ago

@q3d, Have a look at the docs on Where to put your files

If you put your image folders below /user/pages/, you can get an array of images in Twig using page.find('/gallery/2021/28-09').media

If you do not want a bare list of images but instead a slider/gallery, you'll need a plugin like LightSlider and place that in a Twig template.

5 years ago

So the key is to put the files inside: user/pages/gallery, NOT user/images/gallery?

Do I understand correctly?

If I have image arrays it will basically generate any HTML structure for itself.

At the moment, I altogether changed it so that at the time of exporting from Joomla, it copies these files to my directories user/pages/blog/slug with the .md file (probably the standard place in CMS Grav for graphic files attached to the article).

5 years ago

@q3d,

If I have image arrays it will basically generate any HTML structure for itself.

No, you will have to loop the array in Twig and create <img> elements using:

TWIG
{% for image in page.find('/gallery/2021/28-09').media %}
  {{ image.html() | raw }}
{% endfor %}

Images "belonging" to page:
If you place images in the same directory as the page file (*.md), you can get all images for that page using:

TWIG
{% for image in page.media %}
  {{ image.html() | raw }}
{% endfor %}

Image inside Markdown:
If you want to add an image statically in Markdown you could use ![my image](image.jpg)

👍 1
last edited 11/02/21 by pamtbaau

Suggested topics

Topic Participants Replies Views Activity
Support · by Thomas, 1 week ago
2 51 8 hours ago
Support · by Anna, 2 days ago
2 58 11 hours ago
Support · by Justin Young, 11 hours ago
1 30 11 hours ago
Support · by Duc , 1 week ago
2 63 5 days ago
Support · by Colin Hume, 1 week ago
2 55 5 days ago