Add Navigator Menu to a Master Page

Use these instructions to add the Bamboo Navigator Menu Web Part to a master page in SharePoint. The steps are the same for all supported versions of SharePoint, although the master pages themselves vary from version to version. If you don’t have SharePoint Designer, you can download the master page from the SharePoint Master Page Gallery, edit it in a text editor, and upload it back to the Master Page Gallery. Sample master pages are included in the Navigator installation package from version 18.1 on.

Plain Team Site - before snip.png Specifically, the out-of-the-box Team Site v4.master looks like this before making any changes:

updated master page AFTER.png After adding the Bamboo Navigator Menu, it will look like this:

NOTE: Always make a backup of your master page before making any changes to it. If you rename your working copy of v4.master, be sure to change the site settings to reflect the new name of your master page.

Step	Action
1.	Go to the top site of the site collection where you want the master page changed and add a Bamboo Navigator Menu web part to a page on that site. Add values to the Bamboo Navigators list so the menu shows some options. The screenshot shows the Bamboo Navigator Menu web part with three options: Top A, Top B, and Top C. Home and PMC are links on the Top Link bar in the master page. NOTE: You will probably not want to show the web part Title in your master page, so be sure to configure the web part with Chrome Type set to None in the Appearance section of the tool pane as shown here.
2.	While viewing the web part page with the navigator web part in Internet Explorer, press F12 or click Tools > F12 Developer Tools to open the IE Developer window. It opens at the bottom of the page. Make sure the DOM Explorer window is displayed.
3.	Using the Select Element feature of the IE Developer tool, make a note of the tag above or below which you want to insert the navigator.
4.	Edit the web part page where you put the Bamboo Navigator Menu Web Part in SharePoint Designer. From the Page ribbon, expand the menu beneath Edit Page and click Edit in SharePoint Designer. The page (and the site) will open in the SharePoint Designer.
5.	At the top of the web part page code, locate the register tag for the Bamboo Navigator Menu Web Part. Copy the whole tag to your clipboard so you will be able to paste it into the v4.master file. NOTE: If you used the Bamboo Navigator Tab Strip or the Bamboo Tree Menu instead of the Bamboo Navigator Menu, this register tag will be slightly different than the one shown.
6.	In SharePoint Designer, edit the v4.master page in Advanced Mode. IMPORTANT: Always save a copy of the v4.master file before making any changes. As an alternative, consider saving the v4.master with another name and editing the copy rather than editing the v4.master.
7.	Paste the register tag you copied to your clipboard in Step 5 above to the top section of the v4.master file with the other Register tags.
8.	Go back to the web part page code and locate the Bamboo Navigator tag by searching for WpNs0. Copy the whole tag to your clipboard so you will be able to paste it into the v4.master file. NOTE: If you used the Bamboo Navigator Tab Strip or the Bamboo Tree Menu instead of the Bamboo Navigator Menu, this tag will be slightly different than the one shown.
9.	Create a new DIV tag in the v4.master file at the location where you want the Bamboo Navigator Menu Web Part to appear. NOTE: You may consider adding a style to the tag as shown in the code snippet below. When ready, paste the tag you copied in Step 8 into the new DIV tag.
10.	Save the changes to the v4.master and view your SharePoint site. You should see the navigator on all pages that use the v4.master.