How to Set Up the Timezone in Hugo

Do you want your blog to show the right time, no matter where people are?
Here’s how you can set the timezone for your Hugo site.

Step 1: Add the Timezone to Your Settings

Find your main Hugo settings file.
It’s called config.toml (or config.yaml or config.json or hugo.toml).

Open this file.
Add this line:

texttimeZone = "Asia/Tokyo"

Replace "Asia/Tokyo" with your city’s timezone.

Step 2: How Hugo Chooses the Timezone

Hugo checks a few places to find out what time to use:

1. If the date has a timezone, Hugo uses that (like +09:00).
2. If you put a timezone in your templates, Hugo uses it.
3. If you set the timeZone in your config file, Hugo uses that.
4. If you don’t set anything, Hugo uses UTC (the “global” time).

Step 3: Showing Dates in Your Blog

To show the date on your blog, you can use this code:

{{ .Date | time.Format "2006-01-02 15:04:05 MST" }}

If you want to force a date to use a certain timezone, use this:

{{ time.AsTime .Date "Asia/Tokyo" | time.Format "2006-01-02 15:04:05 MST" }}

Now your dates will always show the correct time for your city!

Step 4: For Blogs with More Than One Language

If your blog uses different languages, you can use a different timezone for each one. Just put timeZone = "Asia/Tokyo" under each language in your config file.

Step 5: Extra Step for Special Websites (Like Cloudflare or Netlify)

Sometimes, the place where you put your website (like Cloudflare) doesn't know your timezone. You may need to also tell it which timezone to use by setting:

textTZ=Asia/Tokyo

This helps make sure your times look right everywhere.

Tips and Troubleshooting

• If your blog still shows the wrong time, check that you wrote the timezone name correctly.
• If you see numbers instead of time zone names (like -0700), your website might not know your city’s time. Try setting the TZ variable, or ask for help.

That’s it.
Now your Hugo blog should show the right time, no matter where you are in the world.