Issue with SiteMenu

A place for discussion about skinning and design. Before posting questions here you should review the documentation about creating skins.

This thread is closed to new posts. You must sign in to post in the forums.
10/13/2009 1:08:27 AM
Gravatar
Total Posts 111
Matt Millican InternetMill

Issue with SiteMenu

Hello all,

I am having trouble with the SiteMenu.  I defined it to be a Horizonal menu (where it goes across the page and menus drop down from the top level), however it does not seem to be working at all.  It just stays as Vertical.  Below is my code if it would help any of you.

<portal:SiteMenu ID="siteMenu" runat="server" ShowMenu="true" ShowTreeView="false" TopLevelOnly="false" Direction="Horizontal" />

10/13/2009 9:28:18 AM
Gravatar
Total Posts 2253

Re: Issue with SiteMenu

You must have CSS to go with your menu. Take a look at the mitchinson-earthy skins, they demonstrate a nice way to have "fly-out" style menus. You will be looking at the stylemenu.css file. Also, you will need to add UseSuperfish="true" to your portal:SiteMenu control.

HTH,
Joe D.

10/14/2009 1:05:32 AM
Gravatar
Total Posts 111
Matt Millican InternetMill

Re: Issue with SiteMenu

Hi Joe,

Thanks for your help so far.  I checked my CSS and I still can't figure how to have a horizontal menu with subs drop down.  Any further advice?

10/14/2009 9:58:22 AM
Gravatar
Total Posts 2253

Re: Issue with SiteMenu

Did you take a look at the mitchinson-earthy skins? All you should need to do is copy this into your layout.master (replacing your portal:SiteMenu control):

<portal:SiteMenu id="SiteMenu1" runat="server" UseTreeView="false" HideMenuOnSiteMap="false" UseSuperfish="true" Direction="Horizontal" TopLevelOnly="false"></portal:SiteMenu>

After copying that line into your layout.master, copy the stylemenu.css file from the mitchinson-earthy skin into your skin directory.

That should cover it, you will more than likely have to make adjustments to the colors and positioning in the css file but this will get you the menu with drop downs.

HTH,
Joe D.

10/14/2009 10:52:35 AM
Gravatar
Total Posts 18439

Re: Issue with SiteMenu

Part of it also has to do with where in the layout.master file the SiteMenu is located. If you started with a skin that had a vertical menu its typically in the left panel whereas skins that use a horizontal menu have it above the 3 panels.

My opinion is if you want to design a custom skin with a horizontal menu, start with an existing skin that has a horizontal menu like mitchinson-earthy to make it easier. Colors are easy to change layout changes require more understanding of css, so I recommend start with a skin that has the closest layout and menu structure to what you want to achieve, copy the skin, rnema it and then hack away on the css little by little to make it look how you want.

Hope it helps,

Joe

10/14/2009 1:07:25 PM
Gravatar
Total Posts 111
Matt Millican InternetMill

Re: Issue with SiteMenu

Thanks guys,

That worked for me, now I'm just trying to tweak the menu so that it looks the way I want it to!

Much appreciated!

10/14/2009 1:50:23 PM
Gravatar
Total Posts 111
Matt Millican InternetMill

Re: Issue with SiteMenu

Sorry for so many questions guys, but I do have one more question.

I've been playing with the CSS trying to get the menu items to be fluid width.  Basically, what I want is my page is 930px wide.  I'd like the menu to take up the entire 930px and not have leftover on the right side.  Does that make sense?  And if so, could you maybe point me in the right direction?

Thanks for your help so far!

Matt

10/14/2009 2:02:53 PM
Gravatar
Total Posts 2253

Re: Issue with SiteMenu

For any tweaking CSS I suggest you use FireFox with the FireBug plugin. FireBug allows you to easily modify your CSS on the fly (it doesn't save anything) so you can determine the right changes that need to be made.

I don't know what skin you started with and it is very hard to troubleshoot css without seeing the actual pages. What you might need to do is wrap your menu control in a div and then apply CSS to that div to give the menu the full-page look.

HTH,
Joe D.

You must sign in to post in the forums. This thread is closed to new posts.