0

I'm working on a multilingual site and on my local version of the site I added the default language switcher. It show like this:

<div class="language-switcher-language-url block block-language block-language-blocklanguage-content" id="block-languageswitchercontent" role="navigation">
        <div class="content">
            <ul class="links">
                <li class="en is-active" data-drupal-link-system-path="&lt;front&gt;">
                    <a class="language-link is-active" data-drupal-link-system-path="&lt;front&gt;" href="/" hreflang="en">English</a>
                </li>
                <li class="fr" data-drupal-link-system-path="&lt;front&gt;">
                    <a class="language-link" data-drupal-link-system-path="&lt;front&gt;" href="/fr/a-propos" hreflang="fr">Français</a>
                </li>
            </ul>
        </div>
    </div>

And when I click the link to go to the french version of the site I am send to the /fr/a-propos page. Just like I'd expect.

Now I pushed my site update to my remote server. Looking at the code there. I see the switcher is different:

<div class="language-switcher-language-content-entity block block-language block-language-blocklanguage-content" id="block-languageswitchercontent" role="navigation">
    <div class="content">
        <ul class="links">
            <li class="en" data-drupal-link-query="{&quot;language_content_entity&quot;:&quot;en&quot;}" data-drupal-link-system-path="node/4">
                <a class="language-link" data-drupal-link-query="{&quot;language_content_entity&quot;:&quot;en&quot;}" data-drupal-link-system-path="node/4" href="/">English</a>
            </li>
            <li class="fr" data-drupal-link-query="{&quot;language_content_entity&quot;:&quot;fr&quot;}" data-drupal-link-system-path="node/4">
                <a class="language-link" data-drupal-link-query="{&quot;language_content_entity&quot;:&quot;fr&quot;}" data-drupal-link-system-path="node/4" href="/fr/a-propos">Français</a>
            </li>
        </ul>
    </div>
</div>

The language switcher has a different class not language-switcher-language-url but language-switcher-language-content-entity so my styling is off. I changed to using the ID instead so the styling problem is fixed. but still strange things are happening. Sometimes when I click a link in the switch the url has the language_content_entity as parameter. And currently the active state of the language switch is not working on the remote site?

Using git both sites are exactly the same. The config is the same on both sites and I cleaned cache on my remote site.

Why is this code different on my remote site?

3
  • If source code and config is completely identical on both sites, then obviously there is some content-dependent logic in your language block. Just like <body class=""> changes depending on the viewed page. – Hudri May 24 at 11:32
  • 1
    Language switching is based on language detection methods and what you've described are simply two different methods you have enabled. Normally you only need the path based method. If you have multiple methods enabled you have to be prepared that they are used depending on the context the page is built in. – 4k4 May 24 at 13:45
  • Thanks 4k4, on the Detection and Selection page the option Content language was enabled in the Content language detection section. I turned it off and it is working as expected now. – Joost May 25 at 6:48
1

The answer 4k4 gave was the right one:

Language switching is based on language detection methods and what you've described are simply two different methods you have enabled. Normally you only need the path based method. If you have multiple methods enabled you have to be prepared that they are used depending on the context the page is built in.

0

Possible reason:

  1. Maybe you are not in the same page.
  2. You dont have the same configuration

Solution:

We suggest you add your own custom class or container div. And from these, add the correct CSS.

3
  • I'm on the homepage of the English version. And the config is identical. – Joost May 24 at 9:17
  • Then add a custom class or div container. By this way, you ll fix all problems. – valerogarte May 24 at 9:20
  • This way I only fix the styling problem. And as said in my question I already fixed this. I'm looking for a fix of the difference in code not a temporary patch. – Joost May 24 at 9:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.