HUGO

Hugo Multilingual Multihost and Netlify

Hi! I’m trying to setup Hugo Multilingual Multihost with Netlify and I’m having trouble trying to deploy different sites building the same repo. I created this discussion in Netlify but have reached like a dead end. I’d really appreciate if someone here with experience with Hugo Multilingual Multihost and Netlify could tell me how to solve the issue.

Thanks!

You reached a dead end as in “it is not possible to add multiple hosts from one single repository on Netlify”. That won’t change here :wink:

Either solve that or give up on multilanguage multihost on netlify.

If you want to solve it then create multiple repos (one per language) and connect them all as remotes for your main repo, then push to all remotes when you add new content so all languages get redeployed. Then configure each remote as a source repo for one of the language hosts. Lot’s of work, yes, but that is what “it is not possible” basically means.

https://git-scm.com/book/en/v2/Git-Basics-Working-with-Remotes

1 Like

I see. Could you recommend another hosting service like Netlify but that allows for multihosts the way Hugo needs? If not I’ll try that remote repo approach.

Thanks a lot for the quick response!

Nope, sorry. I never had the need. If you have too much time then set it up like that and add GitHub workflows that take care to push forward to the languages. You could set those actions up so they send email if something fails so you don’t need to think about it anymore after setting it up once.

1 Like

In the Netlify Forums they suggest me to solve everything just using redirects. I have the feeling this approach based on remote repos is better.

What do you think?

Thanks a lot for your time!

That decision depends on what you are doing. If you have an existing website, keep the current structure and adapt the system. If you start new, think about it. If the content is basically identical except for the language, then subdirectories make sense. If it’s completely separate instances content wise (one site just a single page site, the other with subfolders, etc), a multihost solution makes sense. If you have local domain names or brands (my-website.com, meine-webseite.de) then multihost them. But I personally prefer subfolders. From an SEO point of view you have one single domain you have to optimize for.

The whole topic of redirects comes into play if you have old URLs and want to map them to new structure. Makes always sense so that you keep ranking for the pages. On Netlify specifically (dive into the headers docs there) they have features where you can redirect per language or location/country. But in the end, a redirect is not a structural issue, it just moves the visitor where he expects to go.

That probably won’t help too much :wink: If you start from scratch then use subfolders. But that’s an opinion only.

1 Like

Thanks Patrick. I wanted to try the multihost solution as my domains are language-dependent (fisiquimicamente.com for Spanish, physichemically.com for English, fisiquimicament.com for Catalan). I’ll try the remote repo approach and will let you know (I’m now having trouble as I had setup Netlify Large Media for my original site and cannot clone my new remote repos due to permissions. I’m in touch with Netlify Support for it). I’ll let you know my progress, thanks a lot for everything!

I haven’t tested this myself, but:

  • If you add all your language domains as domain aliases to the Netlify site
  • Then set up redirect rules using 200 as status codes (which does not change the URL), e.g. “https://fisiquimicamente.com/* /es/:splat 200”

That should work.

2 Likes

I had that idea too, but what about the SEO implications? A 200 header should be ok, but if Netlify basically has to rewrite every page load, does that maybe slow things down?

I remember reading somewhere that these redirects are not done “just in time” but somehow prepared before the site is published, can’t find it now to re-understand. So maybe it’s not slowing down anything. Would be a great solution for this.

The docs for this are here:

  1. SEO is fine.
  2. Rewrites should be plenty fast
  3. Re. just in time: I don’t see how Netlify can prepare this. This works fine for SPA apps (where URLs are not known in advance) so should work fine for this.

Thanks @bep. I had been pointed to this workaround but AFAIK the URL in the browser will always be my primary domain, is this right? I’d prefer my users to have a better experience, so that each language has its own site, but they’re all connected thanks to Hugo magic

That’s what he is talking about with domain aliases. Add all your domains to point to that Hugo installation. Then rewrite.

So that solution should work with my old installation (without setting a baseURL for each language), right? I need to try it, as I don’t really understand yet that 200 redirect :thinking:

So, with this, if a user navigates to https://physichemically.com/example-page it will be redirected (still showing the physichemically domain) to https://fisiquimicamente.com/en/example-page/. Only issue that I see is that if a user navigates to my original domain, for example https://fisiquimicamente.com/en/example-page/, then it will stay there (and showing exactly that in the address bar). Am I right?

In my head:

  • You set up Hugo in multihost mode, so each language gets its own domain (that way all permalinks will point to the correct domain)
  • You set up 1 redirect rule per language (including your main language)
  • If a user navigates directly to “https://fisiquimicamente.com/en/example-page/” that will translate to “/en/en/example-page/” … which is a page that does not exist (and that is the behaviour you want, I guess)

What I’d really want is to have a working multihost setup, having each language in its own domain, and then configure redirects (301 I guess) so that all my current multilingual links still work (redirecting to their respective sites/domains). For that I should be able to create a Netlify site for each domain, all sites pulling from the same repo but using a different publish directory (public/es, public/en and so on). I’ve already set that up in Netlify but it’s not working presumably due to a Netlify Large Media permissions issue (I’m able to successfully link my sites to the same GitHub repo but I get an error 128 when trying to deploy them, actually when cloning them). As soon as I disable Netlify LM I’ll try again and report back.

Thank you all for your time

Hi all, after disabling Netlify Large Media from my original site I’ve been able to successfully deploy my multihost setup using three different Netlify sites all connected to the same repo but with a different publish directory, specifying each language folder. Everything works great except some small things that I need to investigate (probably related to the theme I’m using, Wowchemy). You can check it out live here (Spanish), here (English) and here (Catalan). I’ve even configured Netlify redirects so my existing links point to the right domain now.

Thanks for everything.

Just in case this could be related to Hugo itself. The issues I’m seeing are related to JavaScript not being correctly loaded, although that only happens in production (I can’t reproduce them locally, where everything works as expected)

Right click > Inspect > Console > Check the red messages. Blackbox guess is CSP :slight_smile:

Not CSP related but almost:

[Error] Failed to load resource: the server responded with a status of 404 () (wowchemy.min.0e1dc40e07de343ba83181ae07edc3bd.js, line 0)
[Error] Refused to execute https://physichemically.com/en/js/wowchemy.min.0e1dc40e07de343ba83181ae07edc3bd.js as script because "X-Content-Type-Options: nosniff" was given and its Content-Type is not a script MIME type.

I guess something needs to be fixed in Wowchemy. Thank you very much!