# Single page back button to page in list

**URL:** <https://discourse.gohugo.io/t/single-page-back-button-to-page-in-list/10757>\
**Category:** support\
**Created:** [February 27, 2018, 5:10am UTC](https://discourse.gohugo.io/t/single-page-back-button-to-page-in-list/10757 "2018-02-27T05:10:02Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![forge](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/forge/32/5388_2.png) [@forge](https://discourse.gohugo.io/u/forge)\
**Post date:** [February 27, 2018, 5:10am UTC](https://discourse.gohugo.io/t/single-page-back-button-to-page-in-list/10757/1 "2018-02-27T05:10:02Z")

</div>

Hello,

I have been building a new blog using Hugo, and I have been enjoying it so far. I had a question about something I am not sure is currently possible.

Following Hugo’s regular hierarchy, I have a list template and a single item template. My list template is paginated, with each page showing the summary of 5 articles.

Currently I have a ‘Back to Articles’ button, when it is clicked it goes to page 1 of the articles list. Is it possible to have a back button that would go back to the page the article is listed on instead?

As an example if the article was on page 5 of the paginated article list, when the ‘Back to Articles’ button was clicked while reading the singular article, it would go back to page 5 of the list.

---

<div class="post-metadata">

**Author:** ![Jura](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jura/32/13581_2.png) [@Jura](https://discourse.gohugo.io/u/Jura)\
**Post date:** [March 2, 2018, 9:55am UTC](https://discourse.gohugo.io/t/single-page-back-button-to-page-in-list/10757/2 "2018-03-02T09:55:56Z")

</div>

> [@forge](#):
>
> As an example if the article was on page 5 of the paginated article list, when the ‘Back to Articles’ button was clicked while reading the singular article, it would go back to page 5 of the list.

From what I know Hugo isn’t aware which position a single page has on a particular paginated list. For Hugo this is complex material because one page can appear in multiple paginated lists, like the time-ordered list on the index, the tag page, section page, and category page.

Perhaps you can use a bit of JavaScript to determine whether the previous page was a paginator page or not? (See [`document.referrer`](https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer) as an example.)

---

<div class="post-metadata">

**Author:** ![Yudy\_Ananda](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/yudy_ananda/32/5664_2.png) [@Yudy\_Ananda](https://discourse.gohugo.io/u/Yudy_Ananda)\
**Post date:** [March 2, 2018, 11:41am UTC](https://discourse.gohugo.io/t/single-page-back-button-to-page-in-list/10757/3 "2018-03-02T11:41:40Z")

</div>

agree with @Jura, I think it will be better if handle with javascript. other than that people tend to use the back button in their browser. this could be another example of [back button](https://www.w3schools.com/jsref/met_his_back.asp)

---

<div class="post-metadata">

**Author:** ![forge](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/forge/32/5388_2.png) [@forge](https://discourse.gohugo.io/u/forge)\
**Post date:** [March 3, 2018, 12:30am UTC](https://discourse.gohugo.io/t/single-page-back-button-to-page-in-list/10757/4 "2018-03-03T00:30:22Z")

</div>

I was playing a bit with solving this with JS before asking the question. My issue was coming up with a way to display the link if the user hadn’t visited a previous page or came from another domain. Reading around about document.referrer though I think I came up with an idea to try. Thanks Jura and Yudy for the help.

---

<div class="post-metadata">

**Author:** ![forge](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/forge/32/5388_2.png) [@forge](https://discourse.gohugo.io/u/forge)\
**Post date:** [March 3, 2018, 9:45pm UTC](https://discourse.gohugo.io/t/single-page-back-button-to-page-in-list/10757/5 "2018-03-03T21:45:46Z")

</div>

I wrote some really janky code, and although it is working, I don’t think I could recommend it:

```
const forge_back = document.querySelector('.forge-article-navigation-back');
if ((forge_back) 
  && (document.referrer.includes(window.location.host))
  && (document.referrer !="") 
  && ((document.referrer.includes('page')) 
     || (document.referrer.includes('summary')) 
     || (document.referrer.includes('tags'))
    )) {
    forge_back.href = document.referrer;
    if (document.referrer.includes('page')) {
      forge_back.innerText = "BACK TO ARTICLES";
    } else if (document.referrer.includes('summary')) {
      forge_back.innerText = "BACK TO SUMMARY";
    } else if (document.referrer.includes('tags')) {
      forge_back.innerText = "BACK TO TAGS";
    }   
};
```