Question

95

Static Html Website - Bootstrap - Multi language Support

rated 0 times [ 100] [ 5] / answers: 1 / hits: 68277 / 10 Years ago, wed, june 4, 2014, 12:00:00

To begin with I want to state that I am newbie in Web Development.

I was asked to build a static website (for a small - size hotel), and I bought this responsive html5 - CSS3 template. It consists of pure html5 - css3 , and some JavaScript for slideshows etc and uses the bootstrap framework.

I have already build the website, and now I was asked to add multilanguage support to it. Can I accomplish this via bootstrap? Can it even be done with CSS?

If not, should I have a copy of all my .html files in a subfolder (e.g website/en/content ) and redirect the user via a link at the top of the page, or should I use JavaScript to decide the language?

Briefly, I would like a user that visits my website from another country to get the English version of the site, while all others get the default language. I want as fast development as possible (that's why I bought a template) to get up and running asap (summer season has already started). I have a reasonable background in programming, but I am totally new in Web Development.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

bradleymoisesy

Add To Favorites

Follow

Total Points: 121

Total Questions: 105

Total Answers: 95

Location: Nepal

Member since Mon, Jan 4, 2021

3 Years ago

bradleymoisesy questions

1 which data type to use to expect date value in jest

Wed, Dec 22, 21, 00:00, 2 Years ago

1 React/Next.js doesn't seem to work with Apexcharts

Tue, Jun 1, 21, 00:00, 3 Years ago

1 React chart : prevent chart's canvas scaling with height and width

Mon, Feb 1, 21, 00:00, 3 Years ago

1 How to create Create an Excel File with javascript?

Thu, Jun 11, 20, 00:00, 4 Years ago

1 How to create a search filter using Vue js from API Data?

Thu, Jan 16, 20, 00:00, 4 Years ago

View All

answered 10 Years ago sergiobrayanc · Accepted Answer

You can do this within a single file without using any server-side programming languages. You should check out i18next for a proper javascript solution.

You can also use pure CSS to translate a homepage. Try something like

.en, .de, .it { display:none; } /* hide all elements with a language class */

.en:lang(en), .de:lang(de), .it:lang(it) { display:block; } /* show those elements that match their language class */

When you set a proper lang attribute on your html tag (e.g. by javascript) you can translate your page very easy:

<div class=en>Good morning</div>

<div class=de>Guten Morgen</div>

<div class=it>Ciao</div>