How do you guys solve that?
How do you guys solve that?
You need to use javascript in order to show a certain block of the text. For example
You have 3 languages on your website
You type some text in the default English in the custom hmlt widget
Now you need to do the translation to other 2 languages and do the mark up
like this:
<div #English>
some text
</div>
<div # German>
some text
</div>
<div #French>
some text
</div>
Then apply the js code which tracks which item is chosen in the lang drop down menu and show the corresponding block of your html
Hope I made it clear for you
This is the only way to get this working as of version 1.8.1. Lang tags won't work in the widget.
1. Add hidden style to your theme custom css:
.hidden { display: none; }
2. Copy and paste this into the HTML block. Replace the content within divs and titles in JS with your own.
<div id="en_text" class="hidden">
<p align="center"><a href="https://www.intrigu.com/join" class="btn btn-danger btn-lg" role="button">Join for FREE now</a>
</div>
<div id="es_text" class="hidden">
Spanish Content
</div>
<div id="pt_text" class="hidden">
Portuguese content
</div>
<div id="fr_text" class="hidden">
French Content
</div>
<div id="ru_text" class="hidden">
Russian content
</div>
<script>var lang=document.documentElement.lang;
if (lang.indexOf("ru-RU")>=0){
$("#ru_text").removeClass('hidden');
document.getElementsByClassName('ow_ic_warning')[0].innerHTML="Russian Title";
}
else
if (lang.indexOf("en")>=0){
$("#en_text").removeClass('hidden');
document.getElementsByClassName('ow_ic_warning')[0].innerHTML="English Title";
}
else
if (lang.indexOf("es-ES")>=0){
$("#es_text").removeClass('hidden');
document.getElementsByClassName('ow_ic_warning')[0].innerHTML="Spanish Title";
}
else
if (lang.indexOf("fr-FR")>=0){
$("#fr_text").removeClass('hidden');
document.getElementsByClassName('ow_ic_warning')[0].innerHTML="French Title";
}
else
if (lang.indexOf("pt-pt")>=0){
$("#pt_text").removeClass('hidden');
document.getElementsByClassName('ow_ic_warning')[0].innerHTML="Portuguese Title";
}
</script>
so please help how to implement code like this for the text/html boxes for mobile version?
anyways thank you Terry for the help so far. i hope they implememnt this in the core in future for all html/text widgets for mobile version and desktop version