I have a translation feature that switches paragraphs from english to french using javascript at the click of a button. Now I manually grab pre-translated paragraphs using innerhtml.I want to store the users action using localStorage. If they click on the translation onclick event, it should automatically run the translate_fr function on every other page. I want to avoid having the user to have to re-translate the website everytime they load a new page.
I have no clue how to do this, with some sort of conditional statement If the user clicks translate_fr the other pages should run a script to repeat that function once they load the other pages and I assume this can be done if their initial choice is stored in the browser using localstorage.
function translate_fr(){
document.getElementById("intro").innerHTML = `Chez Coupe Lion, nous ne sommes qu'un chat établissement offrant une gamme complète de services du toilettage complet, de la baignade à l'embarquement.Vous et votre animal sera ravi de savoir que seul un professionnel, des produits naturels et biodégradables sont utilisés, tout les sensibilités ou les allergies ne seront pas un problème`;
}
<button class="translate" type="button" onclick="translate_fr()">FR</button>
<p id="intro">
Here at Lion Kuts we are a cat only
establishment that offers a full range of services
from complete grooming, bathing to boarding. You and
your pet will be thrilled to know that only professional,
natural and biodegradeable products are used, any
sensitivities or allergies will not be a problem.
</p>
You could try something like this:
function translate_fr() {
document.getElementById(
"intro"
).innerHTML = `Chez Coupe Lion, nous ne sommes qu'un chat établissement offrant une gamme complète de services du toilettage complet, de la baignade à l'embarquement.Vous et votre animal sera ravi de savoir que seul un professionnel, des produits naturels et biodégradables sont utilisés, tout les sensibilités ou les allergies ne seront pas un problème`;
localStorage.setItem("isFrench", "1");
}
function translate_eng() {
document.getElementById("intro").innerHTML = `Here at Lion Kuts we are a cat only
establishment that offers a full range of services
from complete grooming, bathing to boarding. You and
your pet will be thrilled to know that only professional,
natural and biodegradeable products are used, any
sensitivities or allergies will not be a problem.`;
localStorage.setItem("isFrench", "0");
}
function check_translation() {
const isFrench = localStorage.getItem("isFrench");
return parseInt(isFrench);
}
function translate() {
if (check_translation() === 1) {
translate_fr();
return;
}
translate_eng();
}
translate();
translate() on load.localStorage.getItem("isFrench");.