Subdirectory in content not visible (404)

support
1

Hey Hugo users,
I’m new to Hugo and Go and I’m trying to build a site with a modified version of the theme Call me Sam. I want to modify the gallery of the theme to use a smaller version of each image in the overview and only link to the larger version. This is what my layout looks like that compiles fine:

{{ partial "head.html" . }}<body><div class="wrap"><div class="section" id="content">{{ .Content }}</div>
{{ if .Site.Params.clickablePhotos }}<div class="grid">
{{ $name := .Site.Params.galleryFolder | default "images/"}}
{{ $path := "gallery/" }}
{{ $content := "/content/" }}
{{ $src := (print $path $name) }}

{{ $folder := (print $content $path $name) }}

{{ $files := readDir $folder }}

{{ range shuffle $files }}

{{ if not .IsDir }}
{{$previewSubdirectory := "small"}}
<div><a href="{{ $src | absURL }}{{ .Name }}"><img src="{{ $src | absURL }}{{ $previewSubdirectory }}/{{ .Name }}" alt="{{ .Name }}"/></a></div>
{{end}}

{{ end }}</div>
{{ else }}<div class="grid">
{{ $name := .Site.Params.galleryFolder | default "images/"}}
{{ $path := "gallery/" }}
{{ $content := "/content/" }}
{{ $src := (print $path $name) }}

{{ $folder := (print $content $path $name) }}

{{ $files := readDir $folder }}

{{ range shuffle $files }}
<div><img src="{{ $src | absURL }}{{ .Name }}" alt="{{ .Name }}"/></div>{{ end }}</div>{{ end }}
{{ if .Site.Params.mainMenu }}<div class="section bottom-menu">{{ partial "bottom_menu.html" (dict "Page" . "show_back_menu_item" false) }}</div>{{ end }}<div class="section footer">{{ partial "footer.html" . }}</div></div></body>

I have a folder gallery under content. In this gallery folder are images and a subfolder small with the smaller versions of the images:

./gallery:
_index.md  images

./gallery/images:
1_tp.jpg  2_tp.jpg  3_tp.jpg  4_tp.jpg  small

./gallery/images/small:
1_tp.jpg  2_tp.jpg  3_tp.jpg  4_tp.jpg

When I render the site the links to the big and small images seem to be fine:

<div>
    <a href="http://localhost:1313/gallery/images/1_tp.jpg">
        <img src="http://localhost:1313/gallery/images/small/1_tp.jpg" alt="1_tp.jpg">
    </a>
</div>

The problem is that the links to the big images (like http://localhost:1313/gallery/images/1_tp.jpg) work but the ones to the small images (http://localhost:1313/gallery/images/small/1_tp.jpg) throw a 404.

Thanks in advance for the help :slightly_smiling_face:.

2

I solved the problem myself: I was editing the layout file of the templte instead of creating a copy in /layouts and editing that. As I created the new file the problem somehow disappeared :thinking:.