Big img seems to be causing issues with showing up on paginator for homepage

support
1

So I’m running into an issue with bigimg. It seems to load on the front home page but when I click “older posts” via the paginator, the big img disappears and the space is left blank.

Here’s the code for my header.html

`{{ if .IsHome }}
 {{ if .Site.Params.bigimg }}{{ $.Scratch.Set "bigimg" .Site.Params.bigimg }}{{ end }}
{{ else }}
  {{ $.Scratch.Set "title" .Title }}
  {{ if .Params.subtitle }}{{ $.Scratch.Set "subtitle" .Params.subtitle }}{{ end }}
  {{ if .Params.bigimg }}{{ $.Scratch.Set "bigimg" .Params.bigimg }}{{ end }}
{{ end }}

{{ $bigimg := $.Scratch.Get "bigimg" }}
{{ $title := $.Scratch.Get "title" }}
{{ $subtitle := $.Scratch.Get "subtitle" }}

{{ if or $bigimg $title }}
  {{ if $bigimg }}
    <div id="header-big-imgs" data-num-img={{len $bigimg}} 
      {{range $i, $img := $bigimg}}
         {{ if (fileExists $img.src)}} 
          data-img-src-{{add $i 1}}="{{$img.src | absURL }}" 
         {{else}}
          data-img-src-{{add $i 1}}="{{$img.src}}" 
         {{end}}
         {{ if $img.desc}}data-img-desc-{{add $i 1}}="{{$img.desc}}"{{end}}
      {{end}}></div>
  {{ end }}

  <header class="header-section {{ if $bigimg }}has-img{{ end }}">
    {{ if $bigimg }}
      <div class="intro-header big-img">
        {{ $subtitle := $.Scratch.Get "subtitle" }}
        <div class="container">
          <div class="row">
            <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
              <div class="{{ .Type }}-heading">
                <h1>{{ with $.Scratch.Get "title" }}{{.}}{{ else }}<br/>{{ end }}</h1>
                  {{ if $subtitle }}
                    {{ if eq .Type "page" }}
                      <hr class="small">
                      <span class="{{ .Type }}-subheading">{{ $subtitle }}</span>
                    {{ else }}
                      <h2 class="{{ .Type }}-subheading">{{ $subtitle }}</h2>
                    {{ end }}
                  {{ end }}
                  {{ if eq .Type "post" }}
                    {{ partial "post_meta.html" . }}
                  {{ end }}
              </div>
            </div>
          </div>
        </div>
        <span class="img-desc" style="display: inline;"></span>
      </div>
      <center><h1>Recent Posts</h1></center>
    {{end}}
    <div class="intro-header no-img">
      <div class="container">
        <div class="row">
          <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
            <div class="{{ .Type }}-heading">
              {{ if eq .Type "list" }}
                <h1>{{ if .Data.Singular }}#{{ end }}{{ .Title }}</h1>
              {{ else }}
                <h1>{{ with $title }}{{.}}{{ else }}<br/>{{ end }}</h1>
              {{ end }}
              {{ if ne .Type "post" }}
                <hr class="small">
              {{ end }}
              {{ if $subtitle }}
                {{ if eq .Type "page" }}
                  <span class="{{ .Type }}-subheading">{{ $subtitle }}</span>
                {{ else }}
                  <h2 class="{{ .Type }}-subheading">{{ $subtitle }}</h2>
                {{ end }}
              {{ end }}
              {{ if eq .Type "post" }}
                {{ partial "post_meta.html" . }}
              {{ end }}
            </div>
          </div>
        </div>
      </div>
    </div>
  </header>
{{ else }}
  <div class="intro-header"></div>
{{ end }}`

and here's my index.html code

`{{ define "main" }}
<div class="container">
  <div class="col-md-11">
  <div role="main" class="container">
    <div class="row">
      <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
        {{ with .Content }}
        {{ end }}
        <div class="posts-list">
          {{ $pag := .Paginate (where .Data.Pages "Type" "post") }}
          {{ range $pag.Pages }}
            <article class="post-preview">
              <a href="{{ .Permalink }}">
                <h2 class="post-title">{{ .Title }}</h2>
                {{ if .Params.subtitle }}
                  <h3 class="post-subtitle">
                  {{ .Params.subtitle }}
                  </h3>
                {{ end }}
                {{ if .Params.image }}
                <img src="{{ .Params.image }}" alt="{{ .Title }}" class="img-title" />
                {{ end }}
              </a>
              {{ partial "post_meta.html" . }}
              <div class="post-entry">
                {{ if .Truncated }}
                  {{ if .Params.summary }}{{ .Params.summary }}{{ else }}{{ .Summary }}{{ end }}
                  <div id="read-more">
                  <a href="{{ .Permalink }}" class="post-read-more">{{ i18n "readMore" }}</a>
                  </div>
                {{ else }}
                  {{ .Content }}
                {{ end }}
              </div>
              {{ if .Params.tags }}
                <div class="blog-tags">
                  {{ range .Params.tags }}
                    <a href="{{ $.Site.LanguagePrefix | absURL }}/tags/{{ . | urlize }}/">{{ . }}</a>&nbsp;
                  {{ end }}
                </div>
              {{ end }}
            </article>
          {{ end }}
        </div>

        {{ if or (.Paginator.HasPrev) (.Paginator.HasNext) }}
          <ul class="pager main-pager">
            {{ if .Paginator.HasPrev }}
              <li class="previous">
                <a href="{{ .URL }}page/{{ .Paginator.Prev.PageNumber }}/">&larr; {{ i18n "newerPosts" }}</a>
              </li>
            {{ end }}
            {{ if .Paginator.HasNext }}
              <li class="next">
                <a href="{{ .URL }}page/{{ .Paginator.Next.PageNumber }}/">{{ i18n "olderPosts" }} &rarr;</a>
              </li>
            {{ end }}
          </ul>
        {{ end }}
      </div>
    </div>
  </div>
  </div>
  <div class="col-md-1">
    {{ partial "sidebar.html" . }}
  </div>
 </div>
 
{{ end }}
`

Any help would be appreciated. I’m on the Beautiful Hugo theme by Halogenica.

2

We’ll help if you share a complete repo to clone. :slight_smile: