Skip to main content

Automatic translation of whole website with Gtranslate

If anyone need, I offer you my snippet for google translation with Gtranslate plugin. It uses "Globe" icon in header menu as you can see on screen. Just set in case of using this snippet default language in code on your language or on "auto" to detect language from user browser and translate automatically to user language.

add_action('fluent_community/before_header_menu_items', function () {
?>
.gtranslate_wrapper {
display: flex;
align-items: center;
justify-content: center;
margin-right: 10px;
cursor: pointer;
}
.gglobe {
width: 20px !important;
height: 20px !important;
margin-right: -5px;
margin-top: 2px;
}
/ schovΓ‘me pΕ―vodnΓ­ text pokud by se nΔ›kdy objevil /
.gtranslate_wrapper:has([class*="globe"]) {
font-size: 0 !important;
}

<script>
    document.addEventListener('DOMContentLoaded', function() {
        const checkMenu = setInterval(() => {
            const menuRight = document.querySelector('body > div.fcom_wrap > div > div > div.fcom_top_menu > div.top_menu_right');

            if (menuRight && !document.querySelector('.gtranslate_wrapper')) {
                clearInterval(checkMenu);

                // vytvoΕ™Γ­me wrapper
                const wrapper = document.createElement('div');
                wrapper.classList.add('gtranslate_wrapper');

                // vloΕΎΓ­me prΓ‘zdnΓ½ container pro widget (bez textu)
                const innerDiv = document.createElement('div');
                innerDiv.classList.add('gtranslate_placeholder');
                wrapper.appendChild(innerDiv);

                // vložíme na ZAČÁTEK menu
                menuRight.prepend(wrapper);

                console.log('🌍 GTranslate vložen na začÑtek menu');

                // konfigurace GTranslate pro auto translate
                window.gtranslateSettings = {
                    default_language: "cs",
                    detect_browser_language: true,
                    languages: ["cs", "en", "de", "pl"],
                    globe_color: "#b0b0b0",
                    wrapper_selector: ".gtranslate_placeholder"
                };

                // načteme skript
                const script = document.createElement('script');
                script.src = 'https://cdn.gtranslate.net/widgets/latest/globe.js';
                script.defer = true;
                document.body.appendChild(script);
            }
        }, 100);
    });
</script>
<?php

});

Automatic translation of whole website with Gtranslate

Mat β€Ž

Brilliant

Prosper

Very interesting, thank you. To your knowledge, does G-Translate allow creating new URLs with the translations, or does it always keep the same URL? In other words, if we have posts in FC in English and translate everything into French with G-Translate, will the translated pages have different URLs and therefore be indexed by Google as additional pages?

Drive Zone

ProsperΒ premium versions - yes.

Prosper

Drive ZoneΒ which one you chosed?

Drive Zone

ProsperΒ I run on free atm but I am planning to switch on paid because of /cs/ /en/ etc. for permalinks.

Tawsif Ahmed Riyad

That's impressive, hope it will be helpful to others. Thanks for sharing.

N

Nice! I implemented Gtranslate with guidance from previous post from another member and I am impressed how well GTranslate is working. So far, GTranslate is the best for FC imo.

Drive Zone

ProsperΒ this did not work for me, I made it my way.

Prosper

Any thought about this other translation plugin? It seems to be very fast (and fluent) and seems to be compatible with FC: https://www.fluentc.ai/

Prosper

Comparison with G-Translate:

https://www.fluentc.ai/compare/gtranslate/

Prosper

gTranslate hosts all of your translations on their content cloud. Which means your traffic is going to a server you don’t own. If they have an outage, you have an outage. FluentC is designed to keep all translations hosted on your WordPress site without impacting performances.

Morgan McArthur

ProsperΒ very interesting, GTranslate is a bit of a dinosaur however does work with FuentCommunity which is great. Now what you say about the translations not being stored on ones own server is good to know.

Have you used FluentC yet, as I've never heard of them and did the rounds of various translation plugins. I used to use TranslatePress which is great but not FluentCommunity user friendly. GTranslate never used but can be user friendly with such a snippet Drive ZoneΒ shared, which is great!

Morgan McArthur

This is great for overall site transition with GTranslate and course content however it still does not solve multi lingual for an actual community feed with posts and course comments in various languages or am I missing something?

I did see this post from another member Vibe CodeΒ  which would solve the issue of community feed transalations in posts between various languages, hope it can do the same for course comments too. https://community.wpmanageninja.com/portal/space/community-meta/post/ai-features-in-fluentcommunity

Drive Zone

Morgan McArthurΒ when you set default_language: "auto", it works for everything. The only thing it did not solve is multilang emails.

Drive Zone

Morgan McArthurΒ Czech language

Drive Zone

Morgan McArthurΒ English language

Drive Zone

Morgan McArthurΒ ofc when you use Gtranslate in paid versions you have /en/ /cs/ subfolders option, more accurate translation and you can also edit some words how plugin should translate them. I use free version atm.

Morgan McArthur

Drive ZoneΒ thanks for the screenshots. I will have to play around ;) .. and thanks for the snippet code!