How to keep language switch when using logo in nav bar?

Site URL: https://www.slowtravelmorocco.com/

Hey there,

I am using 7.1 and have a language switch installed.

Now I switched up the navigation bar (using a logo now instead of title) and the language switch button is not visible anymore as well as the nav bar shows navigation titles from the other language (using german and english).

My question is: Can someone fix the disappearance of the switch button and place it somewhere else in the navigation bar / or find another solution on where to place the button so it doesn't get lost each time I am changing the style of the navigation bar? Appreciating your support!

This is the current code I have installed:

<style>
    .language {
        position: absolute;
        z-index: 999;
        top: -20px;
        right: 0;
        display: inline-block;
      }
      .language a:first-child {
        border-right: 1px <color=white>
      }
      .language a {
        border: none;
        margin: 0 5px;
        width: 40px;
        height: 26px;
        display: inline-block;
        background-position: center top;
        float: left;
        text-indent: 0;
        color: transparent;
        font-size: 20px;
        <span style="color:white"> Weiße Schrift </span>
      }
      .language [href="/en/home/"] {
        background: none;
        background-size: cover;  
      }
      .language [href="/de/home"] {
        background: none;
        background-size: cover;
        width: 33px
      }

</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(function() { 
  /* SETUP MULTI-LANGUAGE */
  var defaultLanguage = 'de';
  var lang = location.pathname.split("/")[1];
  var defaultClass = 'lang-'+defaultLanguage+'';
  var itemParent = "nav [class*='collection'],nav [class*='folder'],nav [class*='index'],nav [class*='group']";
  if (lang == "" || lang.length > 2 ){
    var lang = defaultLanguage;
  }

  /* ADD LANGUAGE CLASSES */
  $('a[href="/"]').addClass('lang-'+defaultLanguage+'').parents(itemParent).addClass('lang-'+defaultLanguage+'');
  $('nav a:link:not([href^="http://"]):not([href^="https://"])').each(function () {
    var langType = $(this).attr('href').split("/")[1];
    var multiLanguageClass = 'multilanguage lang-' + langType + '';
    if (undefined !== langType && langType.length <= 2) 
      $(this).addClass(multiLanguageClass).parents(itemParent).addClass(multiLanguageClass);
  });
  $('nav button').each(function () {
    var langTypeFolder = $(this).attr('data-controller-folder-toggle').split("/")[0];
    var multiLanguageClass = 'multilanguage lang-' + langTypeFolder + '';
    if (undefined !== langTypeFolder && langTypeFolder.length <= 2) 
      $(this).addClass(multiLanguageClass);
  });

  /* HOMEPAGE-LOGO LINKS TO PROPER LANGUAGE HOMEPAGE */
  if (lang == "en") {
    $('a[href="/"]').attr("href", "/en/home/");
  }

  /* ADD EXCLUSION NAV ITEMS */
  $('.exclude-me,.exclude-me a').addClass('exclude');
  $('.sqs-svg-icon--list a,.SocialLinks-link').addClass('exclude');

  /* REMOVE OTHER LANGUAGES AND KEEP EXCLUDED ITEMS */
  $('.multilanguage:not(".lang-'+lang+',.exclude")').remove();
});

</script>
<script>
/*setup language switcher*/
$('.header-title-text').prepend('<div class="language"><a href="/de/home" class="lang-en">DE</a><a href="/en/home/" class="lang-es">EN</a></div>');
</script>

Hi,

Can you share link to main page?

On 10/21/2021 at 4:21 PM, tuanphan said:

Hi,

Can you share link to main page?

Oh sorry, just saw this reply now.

Thats the link: www.slowtravelmorocco.com

On 11/3/2021 at 7:54 PM, slowtravelmorocco said:

Oh sorry, just saw this reply now.

Thats the link: www.slowtravelmorocco.com

It looks like you removed multilanguage code? I checked & don't see the code

https://www.slowtravelmorocco.com/