I am using below code to create custom navigation, I want to run this globally. I also want, there should some manipulation in navigation items as per the selected parent item. Kindly suggest me how I can achieve the same.
#set($items = $core_v2_customNavigation.Deserialize($core_v2_widget.GetCustomValue('navLinksFirst', '')))
#set($countOne = 0)
#set($itemsSecond = $core_v2_customNavigation.Deserialize($core_v2_widget.GetCustomValue('navLinksSecond', '')))
<div id="secondary-header">
<div class="custom-container">
<div class="clearfix">
<ul id="abc">
#foreach($item in $items)
#if($item.Children && $item.Children.Count > 0)
<li class="meta-large sub-icon">
<a href="javascript:void(0)">$item.Label</a>
<ul class="list-unstyled">
#foreach($child in $item.Children)
#if($child.Children && $child.Children.Count > 0)
<li class="meta-large sub-to-sub">
<a href="javascript:void(0)">$child.Label</a>
<ul>
#foreach($childs in $child.Children)
<li><a href="$core_v2_encoding.HtmlAttributeEncode($childs.Url)">$childs.Label</a></li>
#end
</ul>
</li>
#else
<li><a href="$core_v2_encoding.HtmlAttributeEncode($child.Url)">$child.Label</a></li>
#end
#end
</ul>
</li>
#else
<li class="meta-large"><a href="$core_v2_encoding.HtmlAttributeEncode($item.Url)"> $item.Label</a></li>
#end
#end
#*<li class="sub-icon">
<a href="#">Dynamics 365 Community</a>
<ul>
<li><a href="#">Home</a></li>
<li class="sub-to-sub">
<a href="#">Dynamics 365 Applications</a>
<ul>
<li><a href="#">Sales</a></li>
<li><a href="#">Customer Service</a></li>
<li><a href="#">Field Service</a></li>
<li><a href="#">Talent</a></li>
<li><a href="#">Finance and Operations</a></li>
<li><a href="#">Retail</a></li>
<li><a href="#">Project Service Automation</a></li>
<li><a href="#">Marketing</a></li>
<li><a href="#">Artificial Intelligence</a></li>
<li><a href="#">Mixed Reality</a></li>
<li><a href="#">Business Central</a></li>
<li><a href="#">General</a></li>
</ul>
</li>
<li><a href="#">Dynamics Products</a></li>
</ul>
</li>
<li><a href="#">Learn</a></li>
<li><a href="#">Forums</a></li>
<li><a href="#">Ideas</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">User Groups</a></li>
*#
</ul>
</div>
</div>
</div>