Ecco la soluzione [trovata qui]([url](https://www.ojisanseiuchi.com/2020/01/11/a-folder-based-image-gallery-for-hugo/)). Reviewed-on: #129 Co-authored-by: omartek <olazzari@gmail.com> Co-committed-by: omartek <olazzari@gmail.com>
43 lines
1.4 KiB
HTML
43 lines
1.4 KiB
HTML
<!-- /layouts/shortcodes/foldergallery.html -->
|
|
|
|
<style>
|
|
div.gallery {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
div.gallery a {
|
|
flex-grow: 1;
|
|
object-fit: cover;
|
|
margin: 2px;
|
|
display: flex;
|
|
}
|
|
|
|
div.gallery a img {
|
|
height: 200px;
|
|
object-fit: cover;
|
|
flex-grow: 1;
|
|
}
|
|
</style>
|
|
|
|
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.4.0/jquery.fancybox.min.js"></script>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.4.0/jquery.fancybox.min.css" />
|
|
|
|
<div class="gallery">
|
|
{{ $path := print "static/photos/" (.Get "src") }}
|
|
{{ $url := print (.Get "src") }}
|
|
{{ range (readDir $path) }}
|
|
{{/* don't try to display .DS_Store or directories */}}
|
|
{{ if and (ne .Name ".DS_Store") (not .IsDir) }}
|
|
{{ $src := print "/photos" "/" $url "/" .Name }}
|
|
{{/*
|
|
troubleshoot the $src variable as needed
|
|
<!-- <p>{{ $src }}</p> -->
|
|
*/}}
|
|
<a data-fancybox="gallery" data-caption="{{ .Name }}" href="{{ $src }}">
|
|
<img src="{{ $src }}"> <br/>
|
|
</a>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div> |