Create a multilingual Site with Bludit

[herrdoering]

Hi folks!

I drive a blog in English and German language about my experiences with different kinds of software and how to set it up. From scratch Bludit does not support multilingual sites up to now. So I found an easy solution to this which I'd like to share with you.

In the root of your domain put this snippet of code in a file called index.php:

Code: Select all

<?php
$lang = substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2);
$accepted = ['de', 'en']; 
$lang = in_array($lang, $accepted) ? $lang : 'en';
header("location: {$lang}/");
?>

Next create two folders, in my case called "de and "en" and put a full installation of Bludit in both of these. When installing from scratch you should have no issues with pathes. if you migrate from a single language setup take care to change the URL of your site in the configuration before moving the installation. Possibly you have to change the rewrite base in your .htaccess file afterwards.

Now with this setup somebody calling your domain will get routed to the subfolder corresponding to the language set in his browser - or to English, if this specific browser language is not available at your site.

Maybe it's helpful for one or another.

[Jay]

Administering multilanguage websites based on multiple cms instances becomes tiring when their content needs to be dynamic. Adding new language makes it twice that hard in management.

I'd hit for a solution based on 1 instance with all content conditions set in template.

I've been struggling at the beginning with setting all blog posts under a parent page. I had to make a small change in core to allow all page types to be set as parent.

But with this small thingy, creating multilanguage website with 1 bludit instance is possible. It just needs static pages with langs in their URIs, and set them as parent for corresponding child pages so the url structure becomes domain/lang/page
All other controls like translation strings, generating proper menu items and so on are the matter of proper methods used in template. Some of them you already pointed, but I wouldn't force the user to be redirected as he won't be able to change the website's language at all.

[herrdoering]

With this little script a user is not forced to one language. Because of having two sites he always can switch. This could be done with language links in the sidebar for example. He is just initially routed.

Yes, you are right. Handling multilang sites is not that easy.

- How to map URLs of different site to each other?
- How to unify slugs - by adding numbers?
- What other parts of the site need to be adjusted (slugs/categories/tags)
- Automated backend translations?!? Or translation help?
- Blog-Articles with German specifics or only German language links will be of no use for English language natives.
- ...

There are so many things to take care of, that for me it seems it could be easier to have two sites. I ask myself the question, what benefits would a deeper integration bring?

[Jay]

There are so many things to take care of, that for me it seems it could be easier to have two sites. I ask myself the question, what benefits would a deeper integration bring?

It all depends on goals somebody wants to achieve.
But cramming multiple language version under 1 domain is the first question I'd ask.
But there's another, technical but more important one. Is the tool I have chosen the right one being least time, and resource consuming to achieve the goals?

Bludit has many pros, but also cons. The deeper I got with the backend, the more I realised that this tool needs some modifications to get things done.

I doubt that without some tweaks in htaccess and routing the nested instance will work without hassle.
To be honest I didn't think deeply about multilanguage options in bludit. But with my current experience the easiest approach I'd went with is 1 instace per subdomain. And I'd try to base on symlinks as much as I can to make the instances sharing as many core files, as possible. This would make the management a bit easier (user management and switching between instances for example ) and unify all of them.

[lovermann]

Sorry for necroposting, but my opinion is that search engines like Google are not handling good multilanguage pages. In case Google ranks your website as "written in english", it will be a potential problem to get in search results in google.de or for visitors from Germany.

[Sergelie]

Your Php solution is great.

I implemented a js one, rerouting only on first access. Here it is (just for info):

Code: Select all

<script>
document.addEventListener('DOMContentLoaded', function() {
    let uri = window.location.pathname;
    if (!localStorage.getItem("first-run")) {
        localStorage.setItem("first-run", "true");
        const lang = navigator.language;
        let goto;
        
        if (lang.includes('en')) {
            goto = "https://fcwmedia.com/en/t/home-page";
        }
        if (lang.includes('fr')) {
            goto = "https://fcwmedia.com/t/page-d-accueil";
        }
        
        if (goto) {
            window.location = goto;
        }
    }
});
</script>

[Sergelie]

To toggle FR|EN (or else) on each page of your site. My php solution.

It is specific for my needs and may look a bit messy (I am not a programmer) but it works.

I added comments to help you understand. I will clarify if you need.

Code: Select all

// Optimized URL translation script (and more) for FR/EN language switching page by page

$domain = "https://$_SERVER[HTTP_HOST]";
$page = $_SERVER['REQUEST_URI'];
$currenturl = "$domain$page";
$currentkey = '/en/'; // dir for the site in EN (the FR one is at root level)
$is_t = '/t/'; // for tags
$is_c = '/c/'; // for categories

// for courses page with numbers only in url (same in EN and in FR) 
// FR page would be domain/0001 and EN page would be domain/en/0001
if (preg_match('/\/\d{4}$/', $currenturl)) {
    $number = "0"; // needed below
}

// Define URL mapping arrays for better maintainability and performance
$frToEnMap = [
    'expertise-et-strategie-de-formation/communication-du-risque' => 'expertise-and-training-strategy/risk-communication',
    'expertise-et-strategie-de-formation/relations-media-pro-actives' => 'expertise-and-training-strategy/proactive-media-relations',
    'expertise-et-strategie-de-formation/formation-du-porte-parole' => 'expertise-and-training-strategy/spokesperson-training',
    'expertise-et-strategie-de-formation/introduction-a-la-communication-media' => 'expertise-and-training-strategy/introduction-to-media-communication',
    'expertise-et-strategie-de-formation' => 'expertise-and-training-strategy',
    'trois-bonnes-raisons-de-se-preparer' => 'three-good-reasons-to-prepare',
    'formateurs-portefolio' => 'trainers-portfolio',
    'ressources/liste-de-controle-cadeau' => 'ressources/checklist-gift',
    'login' => 'login', // added to avoid // to French
    'ressources' => 'ressources', // added to avoid // to French
    'cours-en-ligne-plans-de-souscription' => 'online-courses-subscription-plans',
    'organiser-une-session-de-formation' => 'reserve-a-training-session-on-site',
    'cours-en-ligne-liste-complete' => 'online-courses-complete-list',
    'presentation-video-des-4-cours' => 'video-presentation-of-the-4-courses',
    'souscrire-aux-cours-en-ligne' => 'subscribe-to-online-courses',
    't/page-d-accueil' => 't/home-page',
    't/toutes-les-pages' => 't/all-pages'
];

$enToFrMap = array_flip($frToEnMap);

// Check if current URL is English version
$isEnglish = str_contains($currenturl, $currentkey);
$is_c = str_contains($currenturl, $is_c);
$l = $isEnglish ? 'e' : 'f';

// Process URL translation
if (!$isEnglish) {
    // French to English translation
    $paget = ltrim($page, '/');
    $translatedPath = $paget;

    foreach ($frToEnMap as $frKey => $enValue) {
        if (str_contains($paget, $frKey)) {
            $translatedPath = $enValue;
            break;
        }
    }

    $toEN = $domain . $currentkey . $translatedPath;
    echo '<div id="langue"><a href="' . htmlspecialchars($toEN) . '" target="_self">EN</a></div>';
    // you need to style #langue ex:
    // #langue{position:fixed;top:70px;right:24px;width:40px;height:40px;border-radius:50%;zoom:1;background-color:#e9e5e6;color:white;display:flex;justify-content:center;align-items:center;font-family:sans-serif;font-size:16px;font-weight:bold;z-index:32000}


} else { // meaning is FR
    // English to French translation
    $paget1 = substr($page, 3); // Remove '/en'
    $translatedPath = $paget1;


    foreach ($enToFrMap as $enKey => $frValue) {
        if (str_contains($paget1, $enKey)) {
            $translatedPath = $frValue;
            break;
        }
    }


    //  $toFR = $domain . $translatedPath;
    $toFR = $domain . $translatedPath;

    if ($is_t) {
        $toFR = $domain . '/'  . $translatedPath;
    }
    if ($is_c) {
        $toFR = $domain  . $translatedPath;
    }
    if ($number == '0') {
        $toFR = $domain  . $translatedPath;
    }


    echo '<div id="langue"><a href="' . htmlspecialchars($toFR) . '" target="_self">FR</a></div>';
}