Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to list files in a directory with Liquid?

Tags:

jekyll

liquid

I'm trying to learn how to use Jekyll along with Bootstrap; while studying them, I decided that I'd like to have an image carousel on my homepage.

Since I'm really lazy I don't want to hard-code the paths needed to display every image inside the layout, and I wouldn't either prefer to use an array to store the list of images.

I was wondering if there's any tag that could ask Jekyll to do these two steps:

  1. Look inside a specific directory
  2. For each file you found in that directory, repeat a block of code

Basically what I'd like to write is something that vaguely resemble this piece of (imaginary) code:

{% for file in directory %}     <img src="{{ file.url }}" /> {% endfor %} 

So if, for example, I have a folder with three files named image01.jpg, image02.jpg, image03.jpg, I'd like that jekyll could build this HTML code for me:

<img src="folder/image01.jpg" /> <img src="folder/image02.jpg" /> <img src="folder/image03.jpg" /> 

So I had a look at this reference page but I haven't found anything useful for my purpose.

Please, could you give me any suggestion, and if possible, one that doesn't involve the use of a plugin?

Thank you in advance.

like image 496
Cesco Avatar asked Jul 03 '13 11:07

Cesco


People also ask

How do I list files in an operating system?

Use os.listdir() function The os. listdir('path') function returns a list containing the names of the files and directories present in the directory given by the path .

How do I create a list of files?

Using COMPUTER or WINDOWS EXPLORER navigate to the folder containing the files you want to make a list of. o Do not open the folder– you should be 'one level' up so you see the folder itself and not the contents. Press and hold the SHIFT key and then right-click the folder that contains the files you need listed.


1 Answers

You can use this plugin. Copy and paste this code in a file inside the _plugins directory at the root of your Jekyll project.

https://gist.github.com/jgatjens/8925165

Then to use it just add the lines below

{% loop_directory directory:images iterator:image filter:*.jpg sort:descending %}    <img src="{{ image }}" /> {% endloop_directory %} 
like image 136
jgatjens Avatar answered Sep 21 '22 01:09

jgatjens