I'm using the ASP.NET Master Page control for my site with the use of this tutorial: <!-- m --><a class="postlink" href="http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnvs05/html/masterpages.asp">http://msdn.microsoft.com/library/defau ... rpages.asp</a><!-- m -->, 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=http://www.webdeveloper.com/forum/archive/index.php/"~/docs/css/screen.css" />
</head>
<body>
<form id="form1" runat="server">
<div id="wrapper">
<!-- Tab navigation -->
<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><!-- end tabs -->
<div id="screenleft">
<asp:contentplaceholder
id="LeftColumn"
runat="server" />
</div><!-- end screenleft -->
<div id="content">
<!-- dynamic page title -->
<h1><asp:label id="lblPageTitle" runat="server" /></h1>
<br />
<!-- page content -->
<asp:contentplaceholder
id="ContentColumn"
runat="server" />
</div><!-- end content -->
<div id="screenfooter">
This is the footer section
</div><!-- end screenfooter -->
</div><!-- end wrapper -->
<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>
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=http://www.webdeveloper.com/forum/archive/index.php/"~/docs/css/screen.css" />
</head>
<body>
<form id="form1" runat="server">
<div id="wrapper">
<!-- Tab navigation -->
<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><!-- end tabs -->
<div id="screenleft">
<asp:contentplaceholder
id="LeftColumn"
runat="server" />
</div><!-- end screenleft -->
<div id="content">
<!-- dynamic page title -->
<h1><asp:label id="lblPageTitle" runat="server" /></h1>
<br />
<!-- page content -->
<asp:contentplaceholder
id="ContentColumn"
runat="server" />
</div><!-- end content -->
<div id="screenfooter">
This is the footer section
</div><!-- end screenfooter -->
</div><!-- end wrapper -->
<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>