Shopping cart "out of frame" on mobile

Hi everyone,
I can't find a way to make the shopping cart visible on mobile. From the editor, I can see it is enabled but it stays on the very right edge so that I need to use the horizontal navigation bar to find it 😕 (see screenshot).
Any idea on how to fix that?
Thank you in advance!
 

It looks like you probably have an element on the page that is exceeding the viewport width and therefore stretching the page forcing you to scroll horizontally, can you share your website URL so I can troubleshoot it?

1 hour ago, Ziggy said:

It looks like you probably have an element on the page that is exceeding the viewport width and therefore stretching the page forcing you to scroll horizontally, can you share your website URL so I can troubleshoot it?

Sure! https://www.cluegovisit.com/

I can't replicate the issue, which page was it on? But I can see this in the footer:

There's some plain text in the Footer Code Injection, which might be part of the problem? 

2 hours ago, Ziggy said:

I can't replicate the issue, which page was it on? But I can see this in the footer:

There's some plain text in the Footer Code Injection, which might be part of the problem? 

Thank you Ziggy for your assistance!

So you can see the shopping cart on mobile? I'm finding it extremely hard to figure out where to click once you add an item to the cart.

How can I check the footer code injection? Should I share the whole code here?

12 hours ago, verticalberto said:

Thank you Ziggy for your assistance!

So you can see the shopping cart on mobile? I'm finding it extremely hard to figure out where to click once you add an item to the cart.

How can I check the footer code injection? Should I share the whole code here?

You can send all code here, then we can help easier

15 hours ago, Ziggy said:

I can't replicate the issue, which page was it on? But I can see this in the footer:

There's some plain text in the Footer Code Injection, which might be part of the problem? 

27 minutes ago, tuanphan said:

You can send all code here, then we can help easier

Thanks guys, here it is:

HEADER:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<link rel="shortcut icon" type="image/x-icon" href="https://images.squarespace-cdn.com/content/v1/64d13969e151e619dd0c776c/28c435a3-d198-4084-8cdd-2c9492af9153/favicon.ico?format=100w"/>


FOOTER:
<!-- multilingual -->
<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 = 'it';
    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,.header-menu-controls-control').addClass('exclude');

    /* 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="/it/home/" class="lang-es"><span class="flag-icon flag-icon-mx"></span></a></div>');

  });
</script>

<!-- Scroll To Top Button HTML -->
<button id="wm-back-to-top">
  <div class="btt-background"></div>
  <div class="icon">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" aria-labelledby="title" role="img" xmlns:xlink="http://www.w3.org/1999/xlink">
      <title>Angle Up</title>
      <path data-name="layer1" fill="none" stroke="#202020" stroke-miterlimit="10" stroke-width="2" d="M4 42 l28 -26 L60 42" stroke-linejoin="round" stroke-linecap="round"></path>
    </svg>
  </div>
</button>

<!-- Scroll To Top Button Javascript -->
<script>
(function() {
  let throttlePause;

  document.addEventListener('click', function(e) {
    if (!e.target.closest('#wm-back-to-top')) return;
    window.scrollTo({
      top: 0,
      behavior: 'smooth'
    })
  })

  document.addEventListener('DOMContentLoaded', function(){
    let btt = document.querySelector('#wm-back-to-top');
    if (btt?.closest('.sqs-block-content')){
      btt.closest('.sqs-block-content').style.display = 'inline';
    }
  });

  const throttle = (callback, time) => {
    if (throttlePause) return;

    throttlePause = true;
    setTimeout(() => {
      callback();
      throttlePause = false;
    }, time);
  };

  const checkPos = () => {
    let pos = document.documentElement.scrollTop,
        revealHeight = window.innerHeight * 0,
        bttButton = document.querySelector('#wm-back-to-top');
    if (pos >= revealHeight) {
      bttButton.classList.add('show');
    } else {
      bttButton.classList.remove('show');
    }
  }

  window.addEventListener("scroll", () => {
    throttle(checkPos, 150);
  });
  window.addEventListener('DOMContentLoaded', checkPos)
}());
</script>

<!-- TO MAKE FOLDER TITLES CLICKABLE IN SQUARESPACE ON DESKTOP AND MOBILE (7.1) -->
<script>
  $(".header-nav-folder-title[href='/percorsi'], .header-menu-nav-item a[href='/OLD-LINK']").click(function() {
     window.location.href = "/our-walks-italy";
  });
  
    $(".header-nav-folder-title[href='/cluego-overview'], .header-menu-nav-item a[href='/OLD-LINK']").click(function() {
     window.location.href = "/cluego";
  });
</script>

Remove the line circled, but also note the underlined Do not republish, please remove the code from this forum.

17 minutes ago, Ziggy said:

Remove the line circled, but also note the underlined Do not republish, please remove the code from this forum.

Sorry Ziggy I didn't notice that line. I have edited my previous post.
Thank you for fixing the plain text, however I still can't see the shopping cart from mobile 😞

1 minute ago, verticalberto said:

Thank you for fixing the plain text, however I still can't see the shopping cart from mobile 😞

Make sure you have a backup first, but can you try removing the code for the "scroll to top", both the HTML and script?

If that doesn't work then try removing all of the injected code, I'm trying to identify which code is causing the problem.

34 minutes ago, Ziggy said:

Make sure you have a backup first, but can you try removing the code for the "scroll to top", both the HTML and script?

If that doesn't work then try removing all of the injected code, I'm trying to identify which code is causing the problem.

I have removed all the injection code, yet no luck. The cart is still not visible and we still got the horizontal scroll bar in the editor