How to create pagination only for one section?

support
1

Dear all,

I have adapted the Agency Theme for my homepage which consists of several scrollable sections. One section should be my blog entries with pagination. However, when turning to the next page of blog entries, the site should not scroll back to the top but stay at the section #posts.

My posts.html looks like that:

{{ "<!-- Posts -->" | safeHTML }}
<section id="posts">
  <div class="container">
    <div class="row">
      <div class="col-lg-12 text-center">
        <h2 class="section-heading">{{ with .Site.Params.posts.title }}{{ . }}{{ end }}</h2>
      </div>
    </div>

  <div class="row text-block">
        {{ range (.Paginator 3).Pages }}
        <div class="col-lg-4 col-md-3 col-sm-2">
            <div class="text-muted">
                <h4><a href="{{ .Permalink }}">{{ .Title }}</a></h4>
                <div style="text-align:justify;padding:9px">{{ .Summary }}</div>
                <div>
                  <a href="{{ .Permalink }}"><i class="fa fa-arrow-circle-right"></i> Weiterlesen</a>
                </div>
            </div>
        </div>
        {{ end }}
  </div>

  <div style="padding:20px;">
    <center>
    {{ if .Paginator.HasPrev }}
        <a href="{{ .Paginator.Prev.URL }}#posts">
          <i class="fa fa-arrow-circle-o-left fa-2x"></i>
        </a>
    {{ end }}
    <span style="display:inline-block; width: 20px"></span>
    {{ .Paginator.PageNumber | markdownify }} / {{ .Paginator.TotalPages | markdownify }}
    <span style="display:inline-block; width: 20px"></span>
    {{ if .Paginator.HasNext }}
        <a href="{{ .Paginator.Next.URL }}#posts">
          <i class="fa fa-arrow-circle-o-right fa-2x"></i>
        </a>
    {{ end }}
  </center>
</div>
</div>
</section>

As you see, I appended #posts to the pagination URL to stay with the section. The pagination-links show up fine, but when I try to click it on the first page, nothing happens. Only when I right-click the button to open it in another tab, it works, so the link itself is OK. Then, when I am on the second page, both the Next and the Back buttons work perfectly.

I have searched for this problem a lot and read the pagination manual, yet without success. So any help would really be appreciated.

Thanks a lot!

PS: if it helps, I could also provide the link to the online site where you can see the problem.