Introduction Version 2.8 / Dernière mise à jour : 30/09/2025
Bienvenue dans le manuel conword. Vous trouverez
sur cette page les réponses aux questions courantes et tout ce dont vous avez besoin pour installer et utiliser conword sur
ou le site web de votre client.
Langues disponibles
La liste des langues actuellement disponibles et leurs codes linguistiques (« en », « fr », « de », ...) se trouve ici : https://conword.io/sprachen/
Conditions préalables
Le frontend de conword est écrit en javascript, il ne s'appuie donc sur aucun framework. Bien qu'il ne dépende pas de code tiers, il fonctionne bien avec jquery et d'autres outils couramment utilisés.
Conword offre des traductions en temps réel sans stocker de données sur le serveur du client. Conword est donc indépendant du CMS sous-jacent.
Résumé :
Conword fonctionne avec tous les CMS sur tous les serveurs.
Installation
Pour faire fonctionner conword, vous devez inclure la configuration de base du javascript, comme indiqué dans la section suivante. Lorsque le javascript de base est chargé, plusieurs fonctions et objets sont disponibles.
Configuration de base
Intégrer le code JS dans votre HTML
Conword fonctionne sur votre site web avec cette seule ligne de code :
Vous devez disposer d'une licence valide pour votre domaine afin de pouvoir utiliser conword. Si votre domaine ne figure pas sur la liste blanche, conword ne fonctionnera pas sur votre site web.
Options de configuration
Si vous souhaitez configurer les paramètres Conword, vous pouvez utiliser l'objet javascript « conword_config » pour transmettre vos paramètres à l'instance Conword.
Conword fonctionne sur votre site web avec cette seule ligne de code :
Désactive l'attribut rtl dans le <html> balise si une langue avec la fonctionnalité rtl est utilisée (par exemple, l'arabe). Conword définit automatiquement <html lang="rtl"> si cette option n'est pas définie sur false.</html></html>
faux
vrai, faux
disable_language_switcher
Si vous installez conword, un menu déroulant permettant de sélectionner la langue apparaîtra dans le coin inférieur gauche. En définissant disable_language_switcher sur true, vous supprimerez le menu déroulant.
faux
vrai, faux
Note
Vous pouvez utiliser Conword sans l'objet de configuration.
Exemple : désactivation du widget standard de changement de langue
<script>
var conword_config={
disable_language_switcher:true
};
</script>
<script id="conword-root" charset="utf-8" src="https://static.conword.io/js/v2/[client-id]/conword.js"></script>
API Javascript Conword
Si vous souhaitez intégrer la fonctionnalité conword dans votre conception, vous pouvez utiliser l'API Javascript Conword. Pour utiliser l'API, il vous suffit d'intégrer le fichier conword.js dans votre page. Voir Configuration de base
Point de terminaison API
Vous pouvez utiliser l'objet Javascript « Conword » pour invoquer des méthodes API. Pour plus d'informations , consultez le chapitre ci-dessous.
Méthodes API
Conword.translate(clé_langue)
Lance le processus de traduction.
C'est probablement la fonction la plus importante dont vous avez besoin.
Remarque : lorsque vous appelez Conword.translate, Conword.set_user_language() est également appelé, enregistrant automatiquement la langue dans le stockage local.
L'exemple suivant traduit la page actuelle en espagnol :
Conword.translate('es');
Conword.retranslate()
Il existe certains sites Web où le contenu est ajouté dynamiquement à la page. Bien que Conword en soit conscient et observe les modifications, des problèmes surviennent parfois et les traductions doivent être relancées.
La méthode retranslate tente de traduire à nouveau la page dans la langue choisie.
Si la page n'a jamais été traduite auparavant, cette méthode n'aura aucun effet.
Exemple :
Conword.retranslate();
Conword.set_user_language(clé_langue)
Cette méthode enregistre la langue de l'utilisateur dans le stockage local. Elle est automatiquement appelée lorsque Conword.translate() est déclenchée.
Utilisez cette fonction uniquement lorsque vous souhaitez enregistrer la langue de l'utilisateur sans traduire la page.
Lorsque la langue de l'utilisateur est définie, Conword traduira automatiquement la page lors de son prochain chargement.
L'exemple suivant définit la langue de stockage utilisateur sur l'espagnol :
Conword.set_user_language('es');
Conword.unset_user_language()
Supprime (oublie) la configuration linguistique de l'utilisateur.
Exemple :
Conword.unset_user_language();
Conword.get_current_language()
Cette méthode renvoie la clé de langue actuelle (par exemple « en », « es » ou « fr »).
Exemple :
var current_langauge = Conword.get_current_language();
Conword.get_available_languages()
Cette méthode renvoie l'objet langage javascript (voir Objet linguistique).
var language_data = Conword.get_available_languages();
Événements personnalisés
Conword déclenche des événements personnalisés, qui peuvent être écoutés à l'aide d'un EventLister personnalisé.
document.addEventListener("Conword:ready", function(){
/* your code here */
});
Liste des événements personnalisés
« Conword:ready » - sera déclenché lorsque Conword sera chargé et initialisé.
« Conword:translation_started » - sera déclenché lorsque Conword commencera à traduire.
« Conword:translation_done » - sera déclenché lorsque Conword aura terminé une traduction.
« Conword:translation_failed » - sera déclenché lorsqu'une tentative de traduction échoue.
Objet linguistique
L'API Conword fournit un objet qui contient toutes les langues disponibles et leurs métadonnées. L'objet peut être récupéré comme suit :
let languages=Conword.get_available_languages();
L'objet se présente comme suit :
(En fonction des langues disponibles avec votre licence).
{
"de": {
"name_en": "German",
"name_de": "Deutsch",
"name": "Deutsch",
"rtl": false,
"text_title": "Sprache wählen:",
"text_1": "Die Seite wird gerade übersetzt …",
"text_2": "Einen Moment bitte.",
"text_error": "Beim Übersetzen der Seite ist ein Fehler ist aufgetreten."
},
"en": {
"name_en": "English",
"name_de": "Englisch",
"name": "English",
"rtl": false,
"text_title": "Select language:",
"text_1": "The page is being translated ...",
"text_2": "One moment please.",
"text_error": "An error occurred while translating the page."
},
"tr": {
"name_en": "Turkish",
"name_de": "Türkisch",
"name": "Türkçe",
"rtl": false,
"text_title": "Dil seçin:",
"text_1": "Sayfa çevriliyor ...",
"text_2": "Bir dakika lütfen.",
"text_error": "Sayfa çevrilirken bir hata oluştu."
},
"it": {
"name_en": "Italian",
"name_de": "Italienisch",
"name": "Italiano",
"rtl": false,
"text_title": "Selezionare la lingua:",
"text_1": "La pagina è in corso di traduzione ...",
"text_2": "Un momento, per favore.",
"text_error": "Si è verificato un errore durante la traduzione della pagina."
}
}
Exclusion du contenu
Forms
Les entrées utilisateur dans les champs de formulaire tels que et
L'attribut « translate »
Si vous souhaitez que certains éléments ne soient pas traduits, vous pouvez utiliser l'attribut translate. En définissant sa valeur sur « no », Conword ignorera cet élément et tous ses enfants.
Exemple :
<div>
<p>I will be translated</p>
<p translate="no">
I will NOT be translated.
<small>Me neither, since my parent element uses the transate attrube.</small>
</p>
I will be translated as well
</div>
La classe « cnw_skip_translation »
Conword ignorera toutes les balises html contenant la classe « cnw_skip_translation ».
Exemple :
<div>
<p>I will be translated</p>
<p class="cnw_skip_translation">
I will NOT be translated.
<small>Me neither, since my parent element uses the cnw_skip_translation class.</small>
</p>
I will be translated as well
</div>
Note : Les étiquettes vides seront automatiquement ignorées.
Il est possible d'exclure des pages entières en ne chargeant pas conword. Cette opération doit être effectuée par le programmeur qui intègre conword dans le site web.
Exemples
Exemple : lien HTML pour commencer à traduire la page en anglais
<a href="javascript:Conword.translate('en');">Translate to english</a>
Intégration personnalisée de Conword à votre page :
document.addEventListener("Conword:ready", function(){
my_languages=Conword.get_available_languages();
for (var langkey in my_languages) {
language_meta=my_languages[langkey];
// now you can make use of the language object - see the chapter above.
// eg: language_meta.name or language_meta.name_en ...
console.debug(language_meta.name,language_meta.name_en);
// to check if the langkey is the currently active language:
active=false;
if(Conword.get_current_language()==langkey) active=true;
// jquery example of adding menu items
$language_dropdown.append('<li><a class="'+active+'" href="javascript:start_conwordio_translation(\''+langkey+'\');" data-lang="'+langkey+'" data-langname="'+language_meta.name+'" title="Diese Seite auf \''+language_meta.name+'\' übersetzen">'+language_meta.name+'</a></li>');
}
});
// example of a wrapper to call multiple actions (translation, menu controls, tracking, ...) at the same time
function start_conwordio_translation(lang){
Conword.translate(lang);
hide_menu();
matomo_track('Translation',lang);
}
Déplacer le sélecteur de langue par défaut vers la droite, avec css
<style>
body .cnw_translationbox {
right: 30px;
left: auto;
}
</style>
Empêcher la traduction de tous les liens « mailto: » à l'aide de js et de la classe cnw_skip_translation.
document.addEventListener("DOMContentLoaded", function() {
var mailto_links = document.querySelectorAll('a[href^="mailto:"]');
for(var i = 0; i < mailto_links.length; i++){
mailto_links[i].classList.add('cnw_skip_translation');
}
});
Suivi
Afin de suivre les requêtes Conword, nous recommandons d'envelopper l'appel de traduction javascript.
Exemple de script pour suivre les traductions avec Matomo (Piwik) :
Il est également possible d'effectuer le suivi à l'aide des événements personnalisés de Conword. Voici un exemple illustrant comment suivre les traductions Conword avec Piwik (Matomo) :