<script id="conword-root" charset="utf-8" src="https://static.conword.io/js/v2/[client-id]/conword.js"></script>

<script>
	var conword_config={
		disable_rtl_attribute:false,
		disable_language_switcher:false
	};
</script>

<script id="conword-root" charset="utf-8" src="https://static.conword.io/js/v2/[client-id]/conword.js"></script>

<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>

Conword.translate('es');

Conword.retranslate();

Conword.set_user_language('es');

Conword.unset_user_language();

var current_langauge = Conword.get_current_language();

var language_data = Conword.get_available_languages();

document.addEventListener("Conword:ready", function(){
	/* your code here */
});

let languages=Conword.get_available_languages();

{
    "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."
    }
}
  					

<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>

<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>

<a href="javascript:Conword.translate('en');">Translate to english</a>
						

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);
}

<style>
	body .cnw_translationbox {
		right: 30px;
		left: auto;
	}
</style>

document.addEventListener("DOMContentLoaded", function() {
	var mailto_links = document.querySelectorAll('a[href^="mailto:"]');
	for(var i = 0; i < mailto_links.length; i++){
		if(mailto_links[i].innerHTML.indexOf('@')>-1) mailto_links[i].classList.add('cnw_skip_translation');
	}
});

<img src="bild_de.jpg" data-conword-src-de="bild_de.jpg" data-conword-src-en="image_en.jpg" data-conword-src-fr="fr.jpg" class="image_with_different_sources">

document.addEventListener("Conword:translation_done", function(){
	current_language=Conword.get_current_language();
	images_with_different_sources = document.querySelectorAll('.image_with_different_sources'); // or select [data-conword-src-de]
	images_with_different_sources= [...images_with_different_sources]; // convert list to array
	images_with_different_sources.forEach(img => {
		img.src=img.getAttribute('data-conword-src-'+current_language); // change src
	});
});

<a href="javascript:custom_start_translation('en');">English</a>

<script>

	function custom_start_translation(languagekey){
		Conword.translate(language);
		matomo_track( 'Translation '+languagekey, location.href);

	}

	function matomo_track(category,action){
		if(typeof _paq !== 'undefined') {
			_paq.push(['trackEvent', category, action, 1]);
			return true;
		}
		return false
	}

</script>

<script>

	function matomo_track(category,action){
		if(typeof _paq !== 'undefined') {
			_paq.push(['trackEvent', category, action, 1]);
			return true;
		}
		return false
	}

	document.addEventListener("Conword:translation_started", function(){
		matomo_track( 'Translation '+Conword.get_current_language(), location.href);
	});

</script>

<script>

	document.addEventListener("Conword:translation_started", function(){
		gtag('event', 'translation', {
			'url': location.href,
			'language': Conword.get_current_language()
		});
	});

</script>