Customizing menu classes

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.
12/7/2011 1:50:42 PM
Gravatar
Total Posts 130

Customizing menu classes

Hi Joe,

I'm trying to apply custom classes to my skin for the navigation bar. I've read through your Creating Skins documentation several times and seem to be misinterpreting a few things.

I've read the "Custom Menu CSS Classes" page and thought that I could apply custom classes in the theme.skin file but I can not get them to show up. I'm confused on a couple of points.

  • On your "Types of Menus" page it states that the mojoMenu is useful for generating custom menus in mojoPortal. I thought this meant I would add <portal:mojoMenu ... ></portal> in the theme.skin and then insert the mojoMenu portal control in the master.layout file, so I tried this:

[theme.skin]

<portal:mojoMenu runat="server" SkinID="SiteMenu"
ContainerCssClass=""
RootUlCssClass="container"
UlCssClass="children"
RenderLiCssClasses="true"
RenderAnchorCss="false"
LiCssClass="menu-item"
LiRootExpandableCssClass="menu-item-single-col"
LiRootNonExpandableCssClass="menu-item-single-col"
LiNonRootExpnadableCssClass="parent"
LiSelectedCssClass=""
LiChildSelectedCssClass=""
LiParentSelectedCssClass="subchildren"
AnchorCssClass="inactive"
AnchorSelectedCssClass="current"

/>

[master.layout in skin directory]

<portal:mojoMenu  runat="server" Enabled="true" ID="SiteMenu" Direction="Horizontal" UseSpanInLinks="true" HideMenuOnSiteMap="false">

But none of the custom styles are showing up and the styles that are embedded in the html are all .AspNet-Menu-Horizontal

I've tried setting the portal name in the theme.skin & master.layout to to <portal:SiteMenu ..../> and also have tried the <portal:mojoTreeView ... /> but that doesn't reflect my theme.skin style settings either.  I wasn't sure how important the SkinID was so I tried customizing it and matching it to the skin idea for the menu control in the master.layout file and still nothing.

I don't understand where the AspNet-Menu-Horizontal is being inherited from because it is not present in the theme.skin (in fact there are no references to menus at all in the theme.skin).  I also removed the aspnet-menu and treeview stylesheets from the style.config and have stripped the master.layout in the App_MasterPages directory down to the bare minimum (removing unneeded css etc) so that nothing unnecessary is inherited.

Also, caching is disabled, I've restarted the application pool, touched the web.config and cleared my browser's cache.

Any help you have to offer would be greatly appreciated ... I've really hit a wall here!

Thanks,

Beth

12/7/2011 2:17:38 PM
Gravatar
Total Posts 18439

Re: Customizing menu classes

Hi Beth,

You are mostly on the right track but you still need to use <portal:SiteMenu in layout.master not <portal:mojoMenu

mojoMenu and mojoTreeView are used internally by SiteMenu and PageMenu and should not be used directly in layout.master.

You should be able to get the idea by looking at the layout.master and theme.skin files of existing skins like artisteer skins or jqueryui skin.

Also keep in mind that the theme.skin file in the skin folder will not be used under .NET 3.5 medium trust.

Also keep in mind that sometimes the theme cache can be really stubborn, it should clear by editing the theme.skin file or by touching web.config but sometimes it is stubborn and doesn't clear. If all else fails and you really think you have it configured right try rebooting just to be sure.

Hope that helps,

Joe

12/7/2011 3:39:22 PM
Gravatar
Total Posts 130

Re: Customizing menu classes

Hi Joe,

OK, so I set the control back to <portal:SiteMenu ... /> into the Master.Layout file, left the <portal:mojoMenu ... /> in theme.skin file. I have the SkinID set to "SiteMenu1" (What is the relevance of the SkinID setting in the theme.skin file and should it match the SiteMenu control in the master.layout file?).  I touched the web.config, rebooted, and it is still referencing the "AspNet-Menu-Horizontal" classes.

The web.config has mediumtrust set to false. I asked my supervisor if we are running our servers in medium trust and he isn't really sure although we think we are because we have extensive access and can rdp into them to directly adjust settings. But even now, I'm testing these changes out locally through IIS and am the admin of my machine so I should have full permissions at the local level, right???

My application pool is set to .net 4.0

I looked at the artisteer skins & jqueryui skin theme.skin files (within my siteID directory ... sorry I neglected to mention I'm running in multi-site mode) and searched for 'mojomenu' sitemenu' and 'mojoTreeView' and they were simply not present in those files. 

Being that these skins don't have menu styles defined in the theme.skin, I wonder where else they may be set at, or if they will always default to aspmenu and treeview if not explicitly set?  I also wonder if the theme.skin files are being included at all in the skins since the menu settings aren't present. Where is the theme.skin file included in the project?  Should it be referenced in the style.config??? I pulled out agent ransack and searched for theme.skin. I found the mojoPortal.Web.csproj file which lists <None Include=""/> for all of my theme.skin files within the Site directory.  There are <Content Include=""/>  for some of the theme.skin files within my SiteID directory, but not for the new skin I am working with ... not even after I rebuilt the project.

Also, should I be making these changes not within the SiteID directories but in Web->Data->skins->mySkin instead?  I tried adding my skin there but it doesn't seem to be making a difference.

Thanks for your help!

~ Beth

12/7/2011 8:12:42 PM
Gravatar
Total Posts 2169

Re: Customizing menu classes

Hi Beth,

On the <portal:mojoMenu control in the theme.skin file, set the SkinID to SiteMenu. Once you do this, the <portal:SiteMenu control should start pulling in your settings from the <portal:mojoMenu SkinID="SiteMenu" .../> control from the theme.skin file.

The skins contained within your SiteID directory may not have settings Joe A.was referring to because they are probably old versions of those skins. The skins contained in \data\skins are updated with mojoPortal upgrades so you should use those for reference. You should be working within your SiteID directory for skinning. The skins in \data\skins can't be assigned to individual sites. Those files are there so when new sites are created, they can be copied to the new site.

The theme.skin file must be in the root of your skin directory. For instance, if your skin is named MyCoolSkin and your site ID is 4, the path to your theme.skin file is \Data\Sites\4\Skins\MyCoolSkin\theme.skin. .NET looks for the theme.skin file in the /App_Themes directory so mojoPortal uses what is called a VirtualPathProvider to tell .NET where to find the theme.skin file for a given skin. VirtualPathProviders do not work under .NET 3.5 Medium Trust hosting so when using .NET 3.5 with Medium Trust hosting, you have to place your custom theme.skin file in the /App_Themes directory. VirtualPathProviders work in .NET 4 Medium Trust hosting so if you're running .NET 4 you can pretty much ignore this entire paragraph.

As far as you running in Medium or Full Trust hosting, it really has nothing to do with your administrative access to the server. You can easily determine the trust level by clicking the "System Information" link in the Administration menu.

HTH,
Joe D.

 

12/8/2011 3:46:03 PM
Gravatar
Total Posts 130

Re: Customizing menu classes

Thanks Joe(s) for all of the advice and help.  I'm embarrassed to admit that i am still running on version 2.3.5.3 and finally came to the realization that my version of mojo doesn't support custom css classes in the theme.skin (please correct me if I am wrong) ... no wonder I couldn't find any mojomenu controls in the theme.skin :-(

I will upgrade and try again.

~ B

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