I want to share with you a simple way to hide a menu link in Cornerstone depending on the customer group. This is useful when you have a retail customer and you don't want them to see wholesale related web pages in the top menu, or vice versa.
In my example, I am going to hide the "Wholesale" link for retail customers. I already have the page setup, and also the customer groups: Retail for the retail customers, and Wholesale for the wholesale customers.
The first thing to do is to create a script using the Storefont > Script Manager page. Select the following values:
- Name of script: you can put anything here, I put "MenuScript"
- Location: very important that you select Footer
- Script category: Essential
- Script Type: Script
- Script contents: see script below
Copy and paste the script below in the script contents textarea making sure to replace the "Retail" group name and the "wholesale" keyword to match your situation.
<script>
{{#if customer.customer_group_name '===' "Retail"}}
var linkMatch = document.querySelectorAll('a.navPages-action[href*="wholesale"]');
if (linkMatch && linkMatch.length > 0) {
linkMatch[0].style.display = "none";
}
{{/if}}
</script>
Save your changes, and the menu item should be hidden once you refresh the frontend.
I only tested this code on Cornerstone 4.x so you might need to change the code above to suit your specific template.