Пользовательская галерея wowchemy-hugo-themes не работает онлайн или после первой перезагрузки

Я использую wowchemy-hugo-themes starter-hugo-academic. Галерея по умолчанию просто открывает изображение на новой странице. Я пробовал разные коды, и, поскольку мне кажется, что это может конфликтовать с основным кодом шаблона, я определяю новые команды. Но для всего разнообразного кода, который я реализую, модальное окно галереи работает только локально (с помощью команды сервераhugo внутри VScode). Кроме того, после первой перезагрузки вся новая конфигурация исчезнет, ​​и изображения откроются только на новой странице.

основной код был:

      {{< gallery album="demo" >}}

Что я изменил на:

      {{< gallery-custom album-custom="demo" >}}

Я добавляю новый файл с именемgallery-custom.htmlвlayouts/shortcodes/

Код:

      {{/* Gallery Modal Shortcode for Wowchemy. */}}
{{/* Load gallery images from media library. */}}
{{/* https://github.com/wowchemy/wowchemy-hugo-themes */}}

{{/*
    Docs: https://wowchemy.com/docs/content/writing-markdown-latex/#image-gallery

    Parameters
    ----------
    album-custom : required
        Album folder in `assets/media/albums/` to load images from.
    order : default "asc"
        Sort images by title ascending (asc) or descending (desc).
    resize_options : default "750x750"
        Resize options passed to Hugo `.Fit` function (https://gohugo.io/content-management/image-processing/).
*/}}

{{/* For gallery nested in landing page sections */}}
{{ $.Page.Store.Set "has_gallery" true }}

{{/* Get album folder from album-custom parameter. */}}
{{ $album_custom := .Get "album-custom" }}
{{ $album_path := path.Join "media" "albums" $album_custom "*" }}

{{/* Gallery options */}}
{{ $sort_order := .Get "order" | default "asc" }}
{{ $resize_options := printf "%s webp" (.Get "resize_options" | default "750x750") }}

<div class="gallery-grid">

  {{/* Attempt to automatically load gallery images from page bundle */}}
  {{ $images := resources.Match $album_path }}
  {{ range (sort $images "Name" $sort_order) }}
    {{ $image := .Fit $resize_options }}
    {{/* Check if the user set a caption for this image */}}
    {{ $filename := path.Base .Name }}
    {{ $caption := "" }}
    {{ if $.Page.Params.gallery_item }}
      {{ range (where (where $.Page.Params.gallery_item "album" $album_custom) "image" $filename) }}
        {{ $caption = .caption }}
      {{ end }}
    {{ end }}
  {{ $image_size := "gallery-item--medium" }}
  {{if in .Name "-f." }}
    {{ $image_size = "gallery-item--full" }}
  {{else if in .Name "-s." }}
    {{ $image_size = "" }}
  {{else if in .Name "-l." }}
    {{ $image_size = "gallery-item--large" }}
  {{end}}
  <div class="gallery-item {{$image_size}}">
    <a data-fancybox="gallery-{{$album_custom}}" href="{{ .RelPermalink }}" {{ with $caption }}data-caption="{{.|markdownify|emojify|safeHTMLAttr}}"{{ end }}>
      <img src="{{ $image.RelPermalink }}" loading="lazy" alt="{{ plainify $caption | default $filename }}" width="{{ $image.Width }}" height="{{ $image.Height }}">
    </a>
  </div>
  {{else}}
    {{ errorf "Unable to load gallery `%s` in `%s`." $album_path .Page.File.Filename }}
  {{end}}

</div>

Почему так происходит?

0 ответов

Другие вопросы по тегам