Page 1 of 1

[SOLVED] Bilingual site

Posted: Thu Aug 11, 2022 9:51 am
by Appalbarry
Hello folks. I suspect I could figure out a solution on my own, but will ask first: We need a site that displays in either English or French, with an easy way to switch back and forth. So, essentially, two sites.

Has anyone found an easy Wonder way to handle this? I'm thinking:

Home page - with choice of language
Then
Two dir structures, one for each language

I'm thinking this could be three separate Wonder installs, or can it be handled using subpages?

(Sorry, thinking out loud)

Thanks,
Barry

Re: Bilingual site

Posted: Fri Aug 12, 2022 4:57 pm
by nox
Hey Appalbarry,

I'd go with your idea, 2 separate WonderCMS installs where primary website would be mywebsite.com and for additional language mywebsite.com/fr (or mywebsite.com is french version and mywebsite.com/en is english version).
Theme would be the same except for <html lang="en"> and <html lang="fr"> tags.
And custom links for switching (inside header or footer) on English version would point to French version (and on French would point to English version).

Having a home page just for language switch might be bad for search engines and then there is additional step if visitor wants to change the language (should they go back to home page or would there be a language switcher somewhere on the page?).

Re: Bilingual site

Posted: Fri Aug 12, 2022 5:42 pm
by Appalbarry
<i>And custom links for switching (inside header or footer) on English version would point to French version (and on French would point to English version).</i>

OK, good, thank you. Now, where does one look to tweak the header? not from the online side of things obviously.

Forgot to mention: I'm using the Sky theme.

Re: Bilingual site

Posted: Fri Aug 12, 2022 6:06 pm
by nox
Inside theme.php file.

This is a crude representation (Sky theme):

Code: Select all

<section id="topMenu">
  <div class="inner">
    <nav>
      <ul class="menu">
        <!-- Menu -->
        <?= $Wcms->menu() ?>
      </ul>
    </nav>
    <div class="lang-switch">
      <!-- hardcoded absolute url will not switch to current page accordingly 
      (/about - fr/about), always switches to home page (/ - /fr)  -->
      <a href="mywebsite.com">EN</a>
      <a href="mywebsite.com/fr">FR</a>
    </div>
    <style>
      /* Move this inline style for language switcher to theme css */
      .lang-switch {
        position: absolute;
        top: 20px;
        right: 20px;
      }
    </style>
  </div>
</section>
I didn't look into relative paths like "<?= $Wcms->getCurrentPageUrl() ?>" or "<?= $this->getCurrentPageUrl() ?>" but with a bit of tinkering it is possible to switch the language of the current page (about en version - about fr version).

Re: Bilingual site

Posted: Fri Aug 12, 2022 8:41 pm
by Appalbarry
Thank you so much. That was exactly what I needed, and what's better, I can understand how it works.
It's been years since I got into the guts of web stuff like this, and I am enjoying it immensely.
Barry

Re: Bilingual site

Posted: Fri Aug 12, 2022 11:32 pm
by nox
Just a heads-up, if the Sky theme is updated with newer version, all theme changes will be overwritten.

Re: Bilingual site

Posted: Sat Aug 13, 2022 10:14 am
by Appalbarry
<i>Just a heads-up, if the Sky theme is updated with newer version, all theme changes will be overwritten.</i>

Ah well. With luck we only need this for a couple of months then can archive it.