Looping through a github image directory using html

Question

I'm trying to add a gallery to my github pages. In my username.github.io directory, I have an assets/images folder containing some images. I need to loop through all the images and show them.

I've been looking for a solution for a long time and saw some mentioning AJAX and PHP, none of which I know at all.

I tried writing this code but it doesn't work :(

{%for picture in page.image%}
    <div class="image-wrapper">
          <a href="{{ site.baseurl }}/{{ page.image }}/{{picture}}">
               <p>text</p>
                  <!-- <img src="{{ site.url }}{{ site.baseurl }}/assets/images/picture"> -->
          </a>
    </div>
{% endfor %}

I'm guessing for pictures in page.image doesn't work like I thought it would in python. Is there a way around this?

using <a href="{{ site.baseurl }}/{{ page.image }}"> insted of <a href="{{ site.baseurl }}/{{ page.image }}/{{picture}}"> does show the link to my images directory tho.

Hope my noob question hasen't bothered anyone (ﾟωﾟ；)

Answer 1

It looks like page.image is not an array you can loop on, so I would rather go to check it, you should have a full array of your images and then go loop them in your template.
Please, provide all the input and output data you have so we can help you fast and with ease ( maybe codebox ? ).