SB Admin template tips

Today’s tips

If you use the SB Admin template and want the scrollToTop link to be hidden if the page is not scrolled down and become visible when the page is scrolled.

The easy fix:

Select the scrollToTop link and in the options panel Responsive Display click on Reset All.
Now the scrollToTop link works as the javascript is made it should work.

If for some reason you want the link to have the class d-inline, which I do not understand why

The advanced fix

Select the scrollToTop link and in the options panel Responsive Display select Display → none.
open theme.js and replace the scroolToTop code with this

var scrollToTop = document.querySelector('.scroll-to-top');
  
if (scrollToTop) {
    
  // Scroll to top button appear
  window.addEventListener('scroll', function() {
    var scrollDistance = window.pageYOffset;

    //check if user is scrolling
    if (scrollDistance > 100) scrollToTop.classList.replace('d-none','d-inline');
    else scrollToTop.classList.replace('d-inline','d-none');
  });
}
4 Likes