Displaying parent node in vertical navigation, with selected class?
I followed the example here, www.sitefinity.com/.../displaying-the-parent-node-in-the-navigation-widget, and got the parent item to display in my navigation menu. The problem is the <SelectedTemplate> template does not apply to the parent. Meaning, for a child page, it gets decorated with the "sfSel" class, allowing me to highlight it for the current page.
This is not the case if I'm on the parent page. Since I'm using this as sub-page menu, it makes sense to have this page highlighted.
Is there a way to get the parent template link to highlight if the user is currently on that page? Thanks.
I can suggest that you drop a navigation widget on a page which has child pages and set it to use the Horizontal (one-level) template. Then place a second navigation widget on the same page and set it to display the child pages of the current parent page by selecting the All pages under particular page option in the widget's edit mode. You can perform the same in the child pages. This way, the currently selected parent page and the currently selected child page will be highlighted.
I have recorded a short video for your convenience demonstrating the above. Please let me know if the proposed solution helps.
Basically, I used the vertical navigation to get child elements, but added the ParentItemTemplate and told the widget to include the parent in the list (in advanced). However, when I was actually ON that parent page, it didn't add the sfSel CSS to the anchor.
Here's what I was looking for, and as I mentioned, my stop-gap for this was to run a short JS line under the display of the navigation in the template. Note how "About" is bolded (using the sfSel class) when I'm actually on the About page. Seems like just an oversight in the code.
I am glad to hear that you have managed to achieve the desired behavior. As for the <SelectedTemplate> tag, it is applied only to the child pages.