04 July 2021, 3:45

Usually the following code works just perfect but in Mahara we get an error message and the content of the whole page gets distorted, any idea why Mahara behaves so strange?

<div id="google_translate_element" style="padding:1em;"></div>
<script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'en', includedLanguages: 'el,en', autoDisplay: false}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>

It should actually work like on that page here - pretty simple but pretty useful too as we live on an Island with lots of languages and our Mahara will contain many languages and only with a way to translate the content easily (even Google isn't perfect at all) would help to connect people with each other, without having to explain people how to use the Chrome Browser for automatic translation.

https:/ /stnickporticons.com/contact.php (the small Google Translate dropdown below the header)

or like here

https:/ /oliverwittmers.com/racing/ (in the bottom left footer you can use gtranslate to translate from English to German
Why can't it be integrated to Mahara the same easy way?

04 July 2021, 6:18

https:/ /gist.github.com/madelinelise/7a6292c55761f10c6d46e16e78e5ad6d solved

in einem Top Header wurde Google Translate eingefügt:

<div id="google-translate-container">
 <div id="google_translate_element"></div>
</div>

IM Footer der Js Code

<script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({ pageLanguage: "en" }, "google_translate_element");
    // begin accessibility compliance
    $('img.goog-te-gadget-icon').attr('alt','Google Translate');
    $('div#goog-gt-tt div.logo img').attr('alt','translate');
    $('div#goog-gt-tt .original-text').css('text-align','left');
    $('.goog-te-gadget-simple .goog-te-menu-value span').css('color','#000000');
}
$(function() {
  $.getScript("//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit");
});

</script>

For the topper we had chosen 50px as well as for the nabber but probably we will use 38px for the topper as the google bar is also only 38px height.

04 July 2021, 19:46

Hi Andi,

Great that you found a solution. I would have guessed that HTMLPurifier strips out the <script> tag for security reasons. Therefore, putting that into the theme or in the config.php file in the variable 'additionalhtmlhead' and 'additionalhtmlfooter' would have been my suggestion to give it a go. You can see all possible configuration variables that are possible in Mahara in /lib/config-defaults.php

Best,

Kristina