This is a step-by-step guide on how to use qLabel.
In the header of your HTML file, add the following lines in order to load the libraries listed in Step 1:
You can point to the local files instead in case you have set them up in Step 1.
In your website, annotate the text that refers to an object with the URI for the object. The URI has to be resolvable, provide Linked Data, and contain labels in the languages you are interested in. For more background on this topic, read Tim Berners-Lee's introduction to Linked Data.
Find the URI for the object you are looking for. You can use any URI from the Semantic Web. Two easy searchable and quite comprehensive sources of URIs are Wikidata and Freebase.
Once you have the URI, annotate the element with the given text (if there is no element, put the text into one), e.g. like this:
<span class="qlabel" its-ta-ident-ref="http://www.wikidata.org/entity/Q42">Douglas Adams</span>
Do this for all mentions in the text that you want to have translated. The demos offer a few examples of structured data that is easy translatable in many languages.
class is not strictly required for annotation, but is used by
qLabel to find all elements that should be translated.)
You will need to enable the reader of your site to switch the language.
But usually you will provide an element that fires this command based on some user interaction, e.g. a text saying English with an onclick event as for example in the following line of HTML:
A much more comprehensive solution is the Universal Language Selector, a fantastic widget to let the user choose among literally hundreds of languages. The demos use ULS, and you can look in their source code how to use it.