Trying to add a language switch for a site
So I made a simple menu site and I want to add the ability to change language but I'm doing it in a very basic way and it's reseting when changing pages because of reload. Can anyone please help me with this? Any guide that I find is for wordpress and it's not helping because the site is hardcoded.
Top comments (3)
When you say the site is hardcoded, do you mean it's using a static site generator or is it purely handcoded static pages?
Some static site generators offer you the ability to have multilingual support. Here's an example of how it can be done with Gatsby: gatsbyjs.com/blog/2020-02-19-how-t...
In case you're doing things manually, you can have multiple versions of the site living under different directories. For example the English version lives under the root directory, while the French version lives under the
/fr/directory. Here's a concrete example of how that would work:mysite.com/serves the english versionmysite.com/fr/serves the french version, and all links inside of it point to pages inside the/fr/directory so that you don't lose that when refreshing the page or navigating.Disclaimer: Although the second approach is easier to setup, it becomes a nightmare when it comes to maintenance. So I definitely recommend going with a static site generator of your choice and using their approach for i18n.
If you still want to keep things simple, you can take a look at something like static-i18n. It will still generate the multilingual versions of the site for you but at the same time it saves you the hassle of setting up an entire static site generation framework
When I say hard coded I mean that its builded using html css and javascript without any framework with node.
In that case definitely check the static-i18n package. It will be easier to setup than a full SSG and will allow you to build multiple languages of the site in a maintainable way