Jump to content

Force active status of parent main navigation on Gallery - Wells

Recommended Posts

Site URL: https://tan-elephant-y8af.squarespace.com/installations

Good day,

So I am still novice at this and have tried searching the forums, even attempting to modify a code based on the closest result I would like to achieve.

It did not work sadly.

What I would like to happen, is when a user clicks on a gallery from the /installations or /digital works page

the respective /installations or /digital works page remains active while going through the galleries.

installation galleries follow the slug /installation-nameofgallery and same for /digital-works-name-of-gallery

The website may not be visible, so below is a screen shot for reference (forgive the bad mouse writing) and it is using the Wells Template.

image.thumb.png.c8a8884c0c06cc1bddc4a502fa7e7e22.png

Link to comment
  • Replies 4
  • Created
  • Last Reply

You can provide a temp password so we can have a look, thanks

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date format)
💫 Animated Buttons (Referral URL)
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment

Hi bangank36, 

Thank you for responding

I was not sure how to provide a temp password, so I messaged you a contributor account that I made.

If anyone else would like to look at it, I will send the information to you as well.

Link to comment

image.png.52a94d5162575613c613b9e6c49c70b2.png

<script>
	document.addEventListener('DOMContentLoaded', function(){ 
      var urlPath = window.location.pathname.split('/')[1];
      [].forEach.call(document.querySelectorAll(".main-nav li a[href"), function(el) {
        el.parentNode.classList.remove("active-link");
      });
      [].forEach.call(document.querySelectorAll(".main-nav li a[href*="+urlPath+"]"), function(el) {
        el.parentNode.classList.add("active-link");
      });
  }, false);
</script>

Settings -> Advanced -> Custom Code Injection -> Footer

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date format)
💫 Animated Buttons (Referral URL)
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.