You have a very French name 😀.
A couple of people have mentioned the dictionary approach, and that really seems most suitable for your use case (it's been a few years, but last time I had to deal with this, we used a dictionary and a translation service). It's also pretty easy to implement and makes text changes a breeze. Server-side might be better for SEO, but if you're not that worried about it, client-side is totally fine.
Using a dictionary sounds like the best option so far, but I'm still wondering how I could keep the language "preference" when moving from page to page. Do you have any suggestions?
Easiest way to persist the preference would be local storage or a cookie. When the user selects the language preference, you just point to the relevant dictionary object (could be a file or you could just load the object into memory on page load depending on how much text there is).
You mentioned you might duplicate pages in the different languages, but you can just use tokens to reference the text (e.g., {{ myPage.title }} -- see Avalander's post), and dynamically swap the text upon user selection without page requests. If you load the dictionaries when the user first hits the site, you won't need to make subsequent requests, and the UX will be very snappy. However, if you're really gonna go with vanilla JS, then using tokens will likely be more work than it's worth (a framework like Vue gives you that functionality out of the box); in that case, just use innerHTML or innerText on id-targeted elements, e.g., <div id="biography"><!-- your script inserts language-specific biography text here --></div>. Good luck!
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
You have a very French name 😀.
A couple of people have mentioned the dictionary approach, and that really seems most suitable for your use case (it's been a few years, but last time I had to deal with this, we used a dictionary and a translation service). It's also pretty easy to implement and makes text changes a breeze. Server-side might be better for SEO, but if you're not that worried about it, client-side is totally fine.
Oui, je suis moitié française :) (Yes, I'm half french!)
Although for now, I'm looking to translate to Spanish, because of the market in my location.
Using a dictionary sounds like the best option so far, but I'm still wondering how I could keep the language "preference" when moving from page to page. Do you have any suggestions?
Je suis Français aussi (Cajun, en fait).
Easiest way to persist the preference would be local storage or a cookie. When the user selects the language preference, you just point to the relevant dictionary object (could be a file or you could just load the object into memory on page load depending on how much text there is).
You mentioned you might duplicate pages in the different languages, but you can just use tokens to reference the text (e.g., {{ myPage.title }} -- see Avalander's post), and dynamically swap the text upon user selection without page requests. If you load the dictionaries when the user first hits the site, you won't need to make subsequent requests, and the UX will be very snappy. However, if you're really gonna go with vanilla JS, then using tokens will likely be more work than it's worth (a framework like Vue gives you that functionality out of the box); in that case, just use
innerHTML
orinnerText
on id-targeted elements, e.g.,<div id="biography"><!-- your script inserts language-specific biography text here --></div>
. Good luck!