Code for Burger Menu hide on homepage and maps

Web Dev - Documentation Front End - Documentation
, , ,
1

We added custom code to the Themes our platform uses.

The code hides the burger menu on the homepage and map side of the platform, then brings it back inside the forum.

<script type="text/discourse-plugin" version="0.8">
  function toggleBurgerByPath() {
    const desktopIcon = document.querySelector('.header-sidebar-toggle');
    const mobileIcon = document.getElementById('toggle-hamburger-menu');

    const path = window.location.pathname;

    const shouldHide = (
      path === '/' ||
      path === '/docuss/' ||
      path.startsWith('/docuss/')
    );

    if (desktopIcon) {
      desktopIcon.style.display = shouldHide ? 'none' : '';
    }
    if (mobileIcon) {
      mobileIcon.style.display = shouldHide ? 'none' : '';
    }
  }

  document.addEventListener('DOMContentLoaded', toggleBurgerByPath);

  api.onPageChange(() => {
    setTimeout(toggleBurgerByPath, 50);
  });
</script>

It is placed here: Admin > Themes > {click on a theme} > Custom Code > Add the code inside

The code should work for mobile and desktop. It’s been tested on chrome and firefox for android, chrome and firefox for desktop.