How to Retrieve the Current URL in Hugo

In this blog post, we will discuss how to retrieve the current URL in Hugo, a popular static site generator. By obtaining the current URL, you can dynamically display or manipulate content on your website based on the specific page the user is viewing.

In Hugo, you can retrieve the current URL using the .Page.RelPermalink variable. The .Page.RelPermalink provides the relative permalink of the current page, which includes the path and any subdirectories.

To obtain the current URL, you can use the following code snippet:

{{ trim .Page.RelPermalink "/"}}

This code snippet trims any trailing slashes from the relative permalink to ensure a clean URL. Now, let’s take a look at a couple of examples to understand how it works.

Assuming your website domain is “yoursite.com” and you have an eBooks section, the relative permalink for the “ebooks” section would be “/ebooks”. Therefore, when using the code snippet mentioned above, you would retrieve “ebooks” as the current URL.

Similarly, if you have a subdirectory within the eBooks section, let’s say “php”, the relative permalink would be “/ebooks/php”. Using the code snippet, you would obtain “ebooks/php” as the current URL.

By leveraging the current URL, you can enhance the user experience on your website. You might use it to highlight the active page in the navigation menu, display related content, or generate dynamic links based on the current URL.

In conclusion, retrieving the current URL in Hugo is straightforward using the .Page.RelPermalink variable. By incorporating this functionality into your Hugo templates, you can create more interactive and personalized experiences for your website visitors.