p2p.wrox.com Forums

p2p.wrox.com Forums (http://p2p.wrox.com/index.php)
-   ASP.NET 2.0 Professional (http://p2p.wrox.com/forumdisplay.php?f=215)
-   -   Master Page Control/Web.Sitemap Questions (http://p2p.wrox.com/showthread.php?t=52199)

kwilliams January 3rd, 2007 03:59 PM

Master Page Control/Web.Sitemap Questions
 
I'm using the ASP.NET Master Page control for my site with the use of this tutorial: http://msdn.microsoft.com/library/de...asterpages.asp, and I'm running into a few small issues with the use of the Web.sitemap doc. The code below results in about a 10px gap between each button image on the top nav. It also results in a blank button above the "Home" button, and all of the items from Web.sitemap are listed in the left nav. Here's some examples:

This is how the top nav appears:

Home About Us Contact Us

...and this is how I want the top nav to appear:

Home About Us Contact Us

This is how the left nav appears:

Home
 About Us
  Products
  Services
 Contact Us

...and this is how I want the left nav to appear:

About Us (header for buttons - not a button)
Products (button)
Services (button)

So my questions are:

1) How can I remove the indention between the top horizontal nav buttons?
2) How can I remove the empty button at the top of the left nav?
3) How can I filter Web.sitemap so that only the "About Us" items appear in the left column?

------------------------------------------------------------------------------

NavMaster.master:

<%@ Master Language="VB" CodeFile="NavMaster.master.vb" Inherits="NavMaster" Debug="True" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Nav MasterPage</title>
    <link rel="stylesheet" type="text/css" media="screen" href="~/docs/css/screen.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div id="wrapper">

    <div id="tabs">
        <asp:Menu id="Menu2" runat="server"
                    StaticDisplayLevels="1"
                    StaticSubMenuIndent="1"
                   StaticMenuStyle-VerticalPadding="0"
                   Orientation="Horizontal"
                    StaticEnableDefaultPopOutImage="False">
            <Items>
                <asp:MenuItem NavigateUrl="default.aspx" ImageUrl="~/images/gif/tab1_active.gif" />
                <asp:MenuItem NavigateUrl="aboutus.aspx" ImageUrl="~/images/gif/tab2_active.gif">
                    <asp:MenuItem Text="Products" Value="Products"></asp:MenuItem>
                    <asp:MenuItem Text="Services" Value="Services"></asp:MenuItem>
                 </asp:MenuItem>
                <asp:MenuItem NavigateUrl="contactus.aspx" ImageUrl="~/images/gif/tab3_active.gif">
            </Items>
        </asp:Menu>
        </div>
        <div id="screenleft">
            <asp:contentplaceholder
                id="LeftColumn"
                runat="server" />
        </div>
        <div id="content">

            <h1><asp:label id="lblPageTitle" runat="server" /></h1>
            <br />

            <asp:contentplaceholder
                id="ContentColumn"
                runat="server" />
        </div>
        <div id="screenfooter">
            This is the footer section
        </div>
    </div>
    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
    </form>
</body>
</html>

------------------------------------------------------------------------------

NavMaster.aspx.vb:

Partial Class NavMaster
    Inherits System.Web.UI.MasterPage
    Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
        lblPageTitle.Text = SiteMap.CurrentNode.Description
    End Sub
End Class

------------------------------------------------------------------------------

Web.sitemap:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0">
    <siteMapNode url="~/default.aspx" title="Home" description="Home">
        <siteMapNode id="aboutus" url="aboutus.aspx" title="About Us" description="About Us">
            <siteMapNode url="products.aspx" title="Products" description="Products" />
            <siteMapNode url="services.aspx" title="Services" description="Services" />
            </siteMapNode>
        <siteMapNode id="contactus" url="contactus.aspx" title="Contact Us" description="Contact Us" />
      </siteMapNode>
</siteMap>

------------------------------------------------------------------------------

aboutus.aspx:
<%@ Page Language="VB" MasterPageFile="~/NavMaster.master" AutoEventWireup="false" CodeFile="aboutus.aspx.vb" Inherits="aboutus_aboutus" title="About Us" %>
<asp:Content ID="Content1" ContentPlaceHolderID="LeftColumn" Runat="Server">
    <div id="screenleftnav">
        <asp:Menu
            id="Menu1"
            Runat="Server"
            DataSourceID="SiteMapDataSource1"
            StaticDisplayLevels="2"
            DisappearAfter="5"
            StaticEnableDefaultPopOutImage="False" />
    </div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentColumn" Runat="Server">
    This is the main content section
</asp:Content>

KWilliams

thenoseknows January 9th, 2007 07:24 PM

I think given enough time I could figure this out. I had a helluva time with the menu control and spacing on my companies website, and I spent a ridiculous amount of time guess and checking to fix it. Then it didn't even work in Safari and I had to research that on the web and ended up dropping in a hundred lines of browser detection code into my web.config to trick the Menu web control into thinking Safari is an "uplevel browser" (and it clearly is) which it assumes by default is not. It's friggen ridiculous. The HTML that the Menu control pukes onto your client page is chock full of HTML nested tables, and it's not indented in any neat readable fashion either so debugging it is time consuming and frustrating. However just this past week I think the .NET team released some CSS "adapter" classes for the Menu, Treeview and maybe others. I haven't tried them yet but I am thinking it might just be easier to use that, have it spitting out DIV's and stuff, and use CSS to line up your stuff as you see fit.

Let me know how this works. I am likely to follow suite soon.

thenoseknows January 14th, 2007 09:32 PM

I have since used the CSS friendly adapters Microsoft just made available and they seem to work well. I used them with the menu and treeview control and I like them a lot so far.

You will find yourself a lot more successful in styling these web controls if you use the adapter and make a stylesheet for it, than you would by trying to set each property one by one and emitting the standard default HTML (nested table spaghetti).


All times are GMT -4. The time now is 05:18 AM.

Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.