Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
MaryLyn

Multilanguage code possibilities in 7.1.

Question

Dear Community, 

I found a great option to get squarespace website in multilanguage, the base code are great but I did have problem at the end. The main page in english version work as well but when customer choose another flag to switch language the main navigation did not exclude all other langage .

I probably did something wrong on the code could you please help me to get a solution for it ??? it might be simple for some of you but I am beginner. 

Thanks for your help !!!!😍

Find bellow the footer code I used

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/2.6.0/css/flag-icon.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
    $(function() {
    /* SETUP MULTI-LANGUAGE */
    var defaultLanguage = 'en';
    var lang = location.pathname.split("/")[1];
    var defaultClass = 'lang-'+defaultLanguage+'';
    var itemParent = "nav [class*='collection'],nav [class*='folder'],nav [class*='index'],nav [class*='group'],[class*='link']";
    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 == "fr") {
      $('a[href="/"]').attr("href", "/fr/");
      $('#mainNavigation a[href="/fr/"]').parent().remove();
      $('#mobileNavigation a[href="/fr/"]').parent().remove();
     }
      /* ADD EXCLUSION NAV ITEMS */
      $('.sqs-svg-icon--list a,.SocialLinks-link').addClass('exclude');
      $('#mainNavigation a[href="/en/home"]').addClass('exclude').parent().addClass('exclude language');
      $('#mainNavigation a[href="/fr/"]').addClass('exclude').parent().addClass('exclude language');
      $('#mobileNavigation a[href="/en/home"]').addClass('exclude').parent().addClass('exclude language');
      $('#mobileNavigation a[href="/fr/"]').addClass('exclude').parent().addClass('exclude language');

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

    /* SETUP LANGUAGE SWITCHER */
    $('body').prepend('<div class="language"><a href="/en/home" class="lang-en"><span class="flag-icon flag-icon-us"></span></a> <a href="/fr/accueil" class="lang-fr"><span class="flag-icon flag-icon-fr"></span></a> <a href="/de/home" class="lang-de"><span class="flag-icon flag-icon-de"></span></a></div>');

    /* NOT REQUIRED */
    /* SETUP URL REROUTE FOR MATCHING LANGUAGE PAGE */
    switch (window.location.pathname) {
      case '/en/home':
        $(".language a.lang-en").attr("href", "/en/home");
        $(".language a.lang-fr").attr("href", "/fr/accueil");
        break;
      case '/fr/accueil':
        $(".language a.lang-en").attr("href", "/en/home");
        $(".language a.lang-fr").attr("href", "/fr/accueil");
        break;
                                    }
  });
</script>

 

Share this post


Link to post

2 answers to this question

Recommended Posts

  • 0

Have you solved yet?

I can't help with this code, but I also wrote a similar guide, to create 2/3 languages site (just copy code, paste, and code works, no need to do anything)


COVID-19Free priority support for all users (29/03 - 30/04). You can tag me (@tuanphan) or send to my email.

With paid support, see here

 

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...