readDir in my .md and .html

I am trying to build a slideshow that would iterate over all the files contained in a “thumbs” folder next to my content file. It seems that the golang template are not analysed and outputted as is. Could you please be kind enough to let me know what I am missing ?

Hugo version

Hugo Static Site Generator v0.15-DEV BuildDate: 2015-11-02T18:05:51+01:00

My markup file

author = "yann"                                                                                                                                                                 
date = "2015-11-02T15:33:59+01:00"                                                                                                                                              
draft = true                                                                                                                                                                    
gallery = "content/gallery/foo/thumbs"                                                                                                                                          
slug = "foo"                                                                                                                                                                    
tags = ["nature",]                                                                                                                                                              
title = "foo"                                                                                                                                                                   
    {{ $files := readDir }}                                                                                                                                     
    {{ range $files }}<li>{{ .Name }}</li>{{ end }}                                                                                                                             
<div class="slider slider-for">                                                                                                                                                 
   <div><img src="thumbs/dsc04022.jpg"></div>                                                                                                                                   
   <div><img src="thumbs/dsc04023.jpg"></div>                                                                                                                                   
   <div><img src="thumbs/dsc04026.jpg"></div>                                                                                                                                   
   <div><img src="thumbs/dsc04035.jpg"></div>                                                                                                                                   

Thank you for you help.

I don’t see any readDir in your sample, suspect there are more. You need to give a complete picture, the best being a failing repository, to make it possible to help you.

readDir is in the first line after the opening <ul>

@bep not sure to understand what you mean by

don’t see any readDir in your sample

Here it is the directory structure:

yml@garfield$ (git: master) tree 
└── foo
    ├── foo.html
    ├── src
    │   ├── dsc04022.jpg
    │   ├── dsc04023.jpg
    │   ├── dsc04024.jpg
    │   ├── dsc04026.jpg
    │   └── dsc04035.jpg
    └── thumbs
        ├── dsc04022.jpg
        ├── dsc04023.jpg
        ├── dsc04024.jpg
        ├── dsc04026.jpg
        └── dsc04035.jpg

You can only use template functions (like readDir) in layout templates and in shortcodes. I’m guessing a little here, but it looks like you try to use it directly in a content file.

Yes this is exactly what I was trying to do.

Thank you very @bep for getting me back on track :slight_smile:
I am looking for a way to avoid some repetition. I need to indicate both src (relative path to my thumbs folder) and basename (name of my thumbs folder).

Is there a way to get the folder the current content is located ? This will let me pull this out of .Params.
Or maybe someone could proposed a better approach to do this ?


    {{ $src := .Get "src" }}                                                                                                                                                    
    {{ $basename := .Get "basename" }}                                                                                                                                                                                                                                                                                         
    {{ $files := readDir $src }}                                                                                                                                                
    {{ range $files }}<div><img src="{{ $basename }}/{{ .Name }}"></div>{{ end }}                                                                                               


{{< gallery src="content/gallery/foo/thumbs" basename="thumbs">}}
{{ $basename := .Page.Dir }}


{{ $basename := .Page.Path }}

Not sure which it what you want – test them both.

@bep thank you for your hand holding. With your help I managed to achieve exactly what I wanted ; an “almost” automated way to get a gallery content type.


{{/* Build the path to the image from site root */}}                                                                                                                            
{{ $relpath := .Get "relpath" }}                                                                                                                                                
{{ $.Scratch.Set "dir" "content/" }}                                                                                                                                            
{{ $.Scratch.Add "dir" $.Page.Dir }}                                                                                                                                            
{{ $.Scratch.Add "dir" $relpath }}                                                                                                                                              
{{ $dir := $.Scratch.Get "dir"}}                                                                                                                                                
{{ $files := readDir $dir }}                                                                                                                                                    
<div class="slider slider-for">                                                                                                                                                 
    {{ range $files }}<div ><img src="{{ $relpath }}/{{ .Name }}"></div>{{ end }}                                                                                               
<div class="slider slider-nav">                                                                                                                                                 
    {{ range $files }}<div ><img src="{{ $relpath }}/{{ .Name }}"></div>{{ end }}                                                                                               

This shortcode can be used like this:

{{< gallery relpath="thumbs">}}

The thumbs are generated with vipsthumbnails like this:

vipsthumbnail --size=800X0 --rotate --format="../thumbs/%s.jpg" src/*

The last missing part would be to be able to shell out to exec this command when the shortcode is executed but this will be a problem for another day. :-p

Thanks again