Jump to content

idreamofjeannie

Member
  • Posts

    1
  • Joined

  • Last visited

idreamofjeannie's Achievements

Level 1

Level 1 (1/20)

0

Reputation

  1. Hello! I know this question has been asked before but the solution isn't working for me when I try to implement it. It may have to do with the way my code is set up. Since my template and version of Squarespace doesn't have a native "back to top" button, I found code from an outside source instead and injected into the footer and css advanced sections. The result is great on the pages that need the button, but I want to remove it from all mobile and also from desktop home page. The name of my theme is: ORCHID-STURGEON-6MXD.SQUARESPACE.COM Please advise on how I can do this. Thank you! I add this code to SETTINGS → ADVANCED → CODE INJECTION → FOOTER: <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/js/all.min.js" crossorigin="anonymous"></script> <button onclick="topFunction()" id="myBtn" title="Go to top"> <i class="fas fa-arrow-up"></i> </button> <script> window.onscroll = function() {scrollFunction()}; function scrollFunction() { if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { document.getElementById("myBtn").style.display = "block"; } else { document.getElementById("myBtn").style.display = "none"; } } function topFunction() { $('html,body').animate({ scrollTop: 0 }, 1000); } </script> I added this code to DESIGN → CUSTOM CSS section: #myBtn { width: 50px; height: 50px; display: none; position: fixed; bottom: 20px; right: 30px; z-index: 99; border: none; outline: none; font-size: 25px !important; color: white; cursor: pointer; padding: 10px 10px 10px 11px; border-radius: 50%; box-shadow: 1px 1px 5px #000; /* Change the hex code in the next line to change background color */ background-color: #a4a4a4; } #myBtn:hover { background-color: #aeaeae; }
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.