Two top Navigations?
Last Post 05/22/2015 6:44 AM by Joseph Craig. 18 Replies.
Author Messages
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/27/2015 10:00 AM  
I am the front end / skin builders for our company. I am familiar with html, css, and some js.

For our website we want to have two different top navigations.

The business one;

http://chartwell.com/

As well as the careers section that will have different content / and colors like this;

http://chartwell.com/careers/your-career-at-chartwell

*Please cut and paste the second link to see.

I hard coded the navigation when we were launching the site. We are in the process of moving the careers section over from an external vender and we want to be able to add pages in the page manger only to this section.

As far as I understand there is only one menu that ties into the page manger.

<dnn:MENU ID="MENU1" MenuStyle="BootstrapMenu" runat="server">

Is there a plugin or module that can do something like this without getting into more serious development?

Our programmer is very busy with some other stuff right now.

I have been looking on and off for months and not found anything. Any search I do ends up showing me how to style the DNN navigation.
Joseph Craig
DNN MVP
Posts:11667


--
04/27/2015 10:39 AM  
Your skin is using the DDR Menu (that's the dnn:MENU tag) and you are using the BootstrapMenu template.

You can have multiple menus in your skin, each with different templates and each styled separately. You'll probably want to use only the BootstrapMenu template for the main navigation.

You can start here -- http://www.dnnsoftware.com/wiki/ddrmenu -- to learn more about the DDR menu.

For experimentation, you could add a DDR Menu module to a page. The Wiki entries describe all of the options that are available, the default templates that are provided, etc. Quite often, the ULTokens template is all that you will need. Use the IncludeNodes and ExcludeNodes to determine exactly which pages are displayed.

And ... we're here to answer questions as long as you are here to ask them!


Joe Craig, Patapsco Research Group
Complete DNN Support
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/27/2015 11:55 AM  
Thanks for your answer. I appreciate the help.

I am pretty familiar with styling the menus.

The part I am having a hard time wrapping my head around is how to have completely different content like this;

Nav 1

Home : Help me choose : care and services : etc

Nav 2

Career opportunities: Awards : Video : etc
Joseph Craig
DNN MVP
Posts:11667


--
04/27/2015 12:12 PM  
If you search for "DDR" from the home page here, you will find several tutorials on using the DDR menu.

To add multiple menus, you'll need to add multiple dnn:MENU tags to your skin (with different attributes to select different pages -- the default is every page with "show in menu" checked). Or you can add additional DDR modules to pages where you want them.

Joe Craig, Patapsco Research Group
Complete DNN Support
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/27/2015 12:41 PM  
To add multiple menus, you'll need to add multiple dnn:MENU tags to your skin (with different attributes to select different pages -- the default is every page with "show in menu" checked). Or you can add additional DDR modules to pages where you want them.

Do you have any tutorials about how this works?

Or will it be part of the DDR ones?
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/27/2015 2:58 PM  
I can not seem to find part three;

http://www.dnncreative.com/video/in...t-template
Joseph Craig
DNN MVP
Posts:11667


--
04/27/2015 3:07 PM  

Joe Craig, Patapsco Research Group
Complete DNN Support
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/27/2015 3:25 PM  
I am learning about DNN Menu in these which is good.

But I am not seeing anything about how to set up two different top navigations.

Which is the part I am most confused about.
Joseph Craig
DNN MVP
Posts:11667


--
04/28/2015 11:53 AM  
If you want to have two menus, you will need to have two separate dnn:MENU tags in your skin. Each should have a unique ID and you can use separate templates, attributes, and CSS for the two menus.

Alternatively, you can add a second menu using the DDR Module.

If you can provide a description of the two menus and how you want to use them, I may be able to give more specific advice. I assume that you want to use one as the "standard" navigation menu. What do you want the second to do?

Joe Craig, Patapsco Research Group
Complete DNN Support
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/28/2015 2:07 PM  

For our website we want to have two different top navigations.

The business one;

http://chartwell.com/

As well as the careers section that will have different content / and colours like you can see by clicking the careers at Chartwell ribbon at top.

Ideally it would be good if we could add them in the page management tool. If not I am fine with another option as long as I don't have to hard-code it like I did here.

Joseph Craig
DNN MVP
Posts:11667


--
04/29/2015 12:08 PM  
That should not be a problem.

I assume that you want the two navigations on separate pages. To do that, you would have two different skins, differing in the menu options, and css files. This is actually easy to do, and is supported by the DNN framework.

Normally, the pages that appear in a menu are determined by the "include in menu" checkbox in each page's page settings. You can fine tune this with options attached to the menu: ExcludeNodes, IncludeNodes and NodeSelector.

In your case, you might want to have the menu separate from your skin, and insert module versions of the DDR menu so that you can control better how the menu is controlled.

I should also point out that there are third-party menus that provide other expanded functionality. One that I am familiar with is NavXp from DNN Shart (dnnsharp.com). DNN Sharp is one of the first-class module providers to DNN users. Highly recommended.

Joe Craig, Patapsco Research Group
Complete DNN Support
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/29/2015 2:38 PM  
Thanks for your reply I will have a look!

Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
04/30/2015 12:18 PM  
Thanks so much after a bit of messing around that has got it!

There are still a few quirks for the mobile view but that is something I can deal with.
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
05/20/2015 12:37 PM  
Hello;

I am having some issues trying to get this working as my director wants it to work.

We are doing two different top navigations for our DNN website.

I was able to set it up the second one like this;

<dnn:MENU ID="MENU1" MenuStyle="BootstrapMenu" runat="server" IncludeNodes="Is Chartwell Right for You?,Culture,Opportunities,Find Your Role,Rewards,Volunteer" IncludeHidden="true" >

This works great as long as the pages and folders are on the root level to the rest of the website.

Is there a way to do this so that all the pages and folders are inside an already existing folder?

What we want is that all the items in the IncludeNodes list exist inside the careers folder.

so can we do like this

folder one/folder two/page?

/careers/Culture/page 1, page 2, page 3

/careers/Opportunities/page 1, page 2, page 3

I am trying to use NodeSelector but it is not letting me set it up to work this way.

?

Joseph Craig
DNN MVP
Posts:11667


--
05/21/2015 11:58 AM  
I think that I need to see some additional detail. Where is the careers page in your page heirarchy?

Also, you might want to use a different menu template for the second nav on the page. I'd have to see more about the page hierarchy to know that.

Joe Craig, Patapsco Research Group
Complete DNN Support
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
05/21/2015 2:16 PM  
Thanks for the reply.

Maybe this image will help you understand what it is I am looking for. Just so we are clear.

http://postimg.org/image/xqyixkkjn/

Do you see the "Culture" folder at the bottom inside the "Careers" folder.

Is it possible to show the cultures folder on the main menu and the other items in that folder only using nodeselector as well as other folders we want to add?

Thanks for your time I have been banging my head about this for a few weeks.
Sri
Nuke Active Member
Nuke Active Member
Posts:24


--
05/21/2015 3:15 PM  
The issue that we are having with the way I am doing it has to do with the URL showing up in the input box.

on the live site now it is showing that all the inside the careers folder.

Like this

http://chartwell.com/careers/your-c...-chartwell

The way I am doing it with the includenodes looks like this;

/opportunities/recruitment-process

We want it to look like this;

/careers/opportunities/recruitment-process
Joseph Craig
DNN MVP
Posts:11667


--
05/21/2015 3:16 PM  
Some ideas ...

First, I don't understand why you have all of the top level pages hidden from navigation. Things might start off more easily if you make everything visible in navigation, except for pages that really don't want to appear. Then use IncludeNodes, ExcludeNode and NodeSelector to determine what will appear in the navigation.

Second, if you want Culture to appear at the top level, but it there. If you also want Culture to appear as a child of Careers, put a page named Culture there, but have it redirect to the top level Culture page. That's what would make sense to me.

Most of the "off the shelf" templates assume a hierarchical page structure, so it's going to be difficult (impossible?) to use one of them "as is" do do what you want. However, there isn't anything that would prevent you from creating a "BootstrapMenu" template that does do what you want. It might be easier to do this as a Razor template as you can do some programming there. You'd need to locate the nodes (at any level) that you want to appear at the top level in the nav, and then construct the HTML structure, per the bootstrap design. Remember that DDR Menu gives you the whole page hierarchy structure as an XML object, so you pretty much can do anything you want with it. The IncludeNode, ExcludeNodes, and NodeSelector simply modify the tree that is passed to you. You can take the whole thing and do what you want to do, or you can take parts and do what you want there.

But ... if all that you really want to do is make "Culture" appear at the top level and as a child of "Careers" I think that the first option is quite the simplest.

Joe Craig, Patapsco Research Group
Complete DNN Support
Joseph Craig
DNN MVP
Posts:11667


--
05/22/2015 6:44 AM  
I'm not sure that I follow, but if you want /careers/opportunities/recruitment-process , then opportunities needs to be a child of careers, recruitment-process must be a child of opportunities, etc.

Joe Craig, Patapsco Research Group
Complete DNN Support


---