Apologies in advance if this is a simple question -- I'm very new to web development.
I'm trying to make a site multi-lingual (EN & FR).
I understand how to get the buttons to switch from an English site to a French site and vice versa.
HTML:
<body>
<a href="#eng" data-reload>English</a>
<a href="#fr" data-reload>Français</a>
<script>
//define language reload anchors
var dataReload = document.querySelectorAll("{data-reload]");
//Language Translations
var language = {
eng:{
Hello: "Hi!"
},
fr:{
Hello: "Bonjour!"
}
};
//Define language via window hash
if (window.location.hash){
if (window.location.hash === "#fr") {
hi.textContent = language.fr.hello;
}
}
//Define language reload onclick illiteration
for(i=0;i<=dataReload.length;i++){
dataReload[i].onclick=function(){
location.reload(true);
};
}
</script>
The entire site is in English. But I'm not sure how to actually translate the French page... there's very little words so I don't mind translating it myself. Is there any way to do this?
(I've heard great things about i18n, but don't fully understand how to use it yet.)
Thank you!