Clone Project

Show Current State For CMS, Folder Links

Created by
Similar Projects
Oops! Something went wrong while submitting the form.

0 Comments

Be the first to leave a comment.
Loading
User is typing...
No Name
Set
4 years ago
Moderator
This is the actual comment. It's can be long or short. And must contain only text information.
(Edited)
No Name
Set
2 years ago
Moderator
This is the actual comment. It's can be long or short. And must contain only text information.
(Edited)
Load More
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Load More
Description:  
AI Description

This component allows Webflow developers to display the 'current' state on navigation links, even when the links do not directly correspond to the page being viewed. For instance, if a user is on '/blog/your-post', the 'Blog' link in the navigation can still show as active when it points to '/blog'.

Key Features:

  • Dynamic highlighting of navigation links based on the current URL using JavaScript.
  • Utilizes the 'ms-code-nested-link' attribute to determine which links should be highlighted.
  • Enhances user experience by indicating the current section of the website, even for nested pages.

Design Elements:

  • Simple navigation layout with links styled as 'navlink'.
  • Use of the 'w--current' class to visually indicate the active link.
  • Incorporates a video embed to demonstrate functionality.

Potential Use Cases:

  • Blogs that have multiple nested posts and want to highlight the main blog link.
  • E-commerce sites with product categories that have subcategories.
  • Corporate websites with multiple departments or services that require clear navigation.

Conclusion: This component effectively enhances navigation clarity by maintaining the current state of links, making it a valuable addition for any Webflow project that involves nested pages.

Description from Webflow:  
This script & method allows you to display the Webflow "current" state on your links even when you are not linking directly to that page. For example, if a visitor is on /blog/your-post, and your "Blog" link in the nav is going to /blog, this script will make it so that the "Blog" link still has the current state applied.
Tags from Webflow: 
currentlink,  customcode,  webflowhacks,  memberscript
.