Hi, I need to add a second navigation header to my website. Is this possible?
Our client’s website has two categories, Sheep and Cattle, and they use different products with different coloured branding.
I need to be able to duplicate the navigation as is, and change the colours. Then apply the Cattle Navigation to the cattle pages and the sheep navigation to the sheep pages.
Any advice will be welcomed.
Thanks Mark
This is definitely possible.
If the links really are different between the cattle version and the sheep version, you’d basically just duplicate the existing navigation (if it’s already a component, detach the duplicated instance so that you can create the new ‘sheep nav component’) and modify it to look like what the sheep version should look like. You may need to modify some of the class names on the elements inside of the nav so that you aren’t overriding the cattle version’s styles. Then drop the correct version of the nav on each page as-needed.
In the future, you’ll just need to remember to update both versions of the navigation if you’re making changes that would affect them both.
Thanks for the help, I’ll give it a go
You can also use component properties, keeping one component with variations of it via properties you assign.
Can learn more about it here: Components | Webflow University