Multilingual site works fine locally, but stopped rendering properly when deployed online

support
1

Hi all.

First of all, my website is deployed here, and uses the hugo-profile theme.

You can look at the code in the GitHub Pages repository here.

The site uses a multilingual setup, where the default language is deployed at the root (/), and the secondary one lives in a subfolder.

Up until recently, everything was working fine. I could use the language switcher to freely change between English and Spanish, and the appropriate content would be loaded. I also have a custom shortcode that was working wonderfully, which loads the original language of a page if there isn’t a localized version for the currently selected language.

Here’s a link to an older commit where everything was working as expected. Please note, at this point in time English was the default language (root folder), whereas Spanish was in the /es subfolder.

However, I recently made some significant changes that modified a few things:

When I run hugo server in my local machine, everything works perfectly at http://localhost:1313. Spanish is loaded at the root, and I can freely switch between English and Spanish using the dropdown. My shortcode also works perfectly.

However, when I push that to the master branch and the site gets deploye by GitHub Actions, the multilanguage setup breaks. The default language (Spanish) still works just fine, but when I switch to English the homepage doesn’t show the blog posts but rather the About page (in Spanish too!), my translation shortcode no longer works in blog posts, and the nav bar links are also generally broken.

I’ve made sure to purge the /public folder before building, reload the site avoiding caches, etc., and also tried playing around with a few more settings. But for the life of me I can’t figure out what’s causing the site to break when deployed online while it continues to work wonderfully in my machine.

Any help would be greatly appreciated!

2

I built your site locally and it seems to work using

  • v138.0 (my default)
  • v124.1 (yours as seen in your committed public folder)

BUT your github action is configured to use

  • v116.1 which seems to have your strange effect .

give it a try to use 124.1 as you seem to use locally.

I would also recommend to remove the public folder from the repo (remove, commit, add to gitignore). This contains files generated with hugo server pointing to localhost :wink: keep in mind,

  • that a call to hugo will not delete ancient stuff.

  • you build all pages in your workflow anyway.

the resources folder may be kept for caching - but with <3sec build time you may also remove it.

if everything works fine, you may also switch to 138.0…

1 Like
3

Thanks so much.

I had completely missed that the Hugo version was determined in the GitHub workflow and not taken from my local Hugo version… just like I mistakenly thought that I actually had to commit the public folder :sweat_smile:

That fixed it!

One more thing, if I may abuse your generosity:

This probably has more to do with CSS than Hugo, but… do you have any idea of why the avatar image in the About page is visible in the desktop version of the site, but not on the mobile version?

I assume it’s probably related to the way the columns and rows are defined but unfortunately I’m not very knowledgeable about CSS and it takes me quite a while to figure these things out by myself.

4

a combination of theme css and the theme layouts -

so a complete different problem which definitely needs a new topic

if you need assistance for it, try to find out, and in case you need help show how far you got and where you need help.
see: Requesting Help

5

Yep, will do that.

Thanks again for all your help. I’m always amazed at how fast and efficient support is in these forums!

1 Like
6

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.