Building Custom Navigation with SharePoint

1
Building Custom Navigation with SharePoint

• Mauro Cardarelli
• Jornata
• mauro.cardarelli_at_jornata.com

2
Agenda

• Navigation Primer
• Why Do You Need Custom Navigation?
• Design Considerations
• Sample Code Snippets
• Overview of Navigation Control Deployment
• Summary
• Questions

3
Navigation Primer Quick Launch

• Quick Launch
• Displayed on the home page of a Windows
  SharePoint Services 3.0 site and contains links
  to featured lists and libraries on the site,
  subsites of the current site, and People and
  Groups.
• Through Site Actions, a site administrator can
• Hide or show the Quick Launch
• Add or remove a list or library from the Quick
  Launch
• Change the order of items on the Quick Launch
• Add, edit, or delete a Quick Launch heading
• Edit, move, or delete a Quick Launch link

4
Navigation Primer Top Link Bar

• Top Link Bar
• Provides a way for users of your site to get to
  other sites in the site collection by displaying
  a row of tabs at the top of every page in the
  site.
• 3 different configuration options
• Inherited and included in parent   The site is
  included as a tab on the top link bar of the
  parent site and uses the same top link bar as the
  parent site. The top link bar cannot be
  customized at this level without first breaking
  the inheritance from the parent site.
• Inherited not included parent   The site uses the
  same top link bar as the parent site but is not
  included as a tab on the top link bar of the
  parent site. The top link bar cannot be
  customized at this level without first breaking
  the inheritance from the parent site.
• Unique   The site is not included as a tab on the
  top link bar of the parent site and does not use
  the same top link bar as the parent site. The top
  link bar is customizable at this level and is
  completely separate from the parent site.

5
Navigation Primer Top Link Bar

• Through Site Actions, a site administrator can
• Configure the top link bar for a site
• Add, edit, or remove a link from the top link bar
• Reorder links on the top link bar

6
Quick Tip Flyouts

• The Top Link Bar supports the use of flyouts
  (dynamic navigation to subsites)
• The default setting is to go one level below the
  current
• What if you want more?
• In the default.master file (or the master file in
  use) look for the 'MaximumDynamicDisplayLevels'
  property.
• It is set to 1 by default change it to 2 and you
  now have dynamic flyouts that go two levels deep

7
Architecture

• To understand what can be done programmatically,
  it is important to understand the underlying
  architecture
• Office SharePoint Server 2007 bases its
  navigation model on the hierarchical structure of
  the site collection. By using the navigation
  features, you can link to the following
• A site's subsites
• A site's peer sites
• Sites higher in the site structure
• Web pages in a site

8
Architecture

• The role of the master page
• Contains the elements that you want all pages in
  your site to share, such as branding information,
  common commands such as Search, and navigation
  elements that you want to be available throughout
  the site
• Provides the menu style of the navigation
  controls. You can configure master page menu
  style by using Microsoft Office SharePoint
  Designer

9
Additional Terminology

• Global Navigation
• Top Link Bar
• Current Navigation
• Quick Launch
• Breadcrumb Navigation
• Associated with the master page
• Additional Navigation (Web Parts)
• Summary Links
• Table of Contents
• Content Query

10
Why Do You Need Custom Navigation?

• Super Rich User Experience
• Aesthetics
• Functionality / Effects
• Exceptions to Standard Navigation
• Extend the native navigation to include
  additional functionality
• Typical Profile
• Wireframe comes from professional design team
• Business users demand specific navigation
• Internet facing requires high polish

11
Design Considerations

• Performance
• New navigation cannot impede page rendering times
• Cross Browser Capabilities
• For internet based deployments, how does the
  experience differ for non-IE users do you care?
• Dynamic vs. Controlled
• Is navigation constructed real-time (SharePoint
  API) or read from some external source (XML
  file)?
• Security
• What are the security consideration for custom
  development (i.e. continue to enforce security
  trimming)

12
Exemplar Navigation
13
Quick FYIs

• Experience with using the SharePoint object model
  is assumed
• Great improvements over SPS 2003
• Note that objects used to programmatically
  customize navigation reside in the
  Microsoft.SharePoint.Navigation namespace
• The SPWeb object has a new property named
  Navigation that returns a SPNavigation object.
  This object allows developers to programmatically
  control the navigation of a SharePoint site.
• This coding can done as part of custom navigation
  development or even site provisioning

14
Code Snippet Example 1
Source Todd Baginskis Blog
15
Code Snippet Example 1

• SPSite sharedNavSite new SPSite(http//server/t
  est/sharednav)
• SPWeb sharedNavWeb sharedNavSite.OpenWeb()
• sharedNavWeb.Navigation.UseShared true

• SPSite sharedNavSite new SPSite(http//server/t
  est/sharednav)
• SPWeb sharedNavWeb sharedNavSite.OpenWeb()
• sharedNavWeb.Navigation.UseShared false

Source Todd Baginskis Blog
16
Code Snippet Example 2

• SPSite quickLaunchSite new SPSite(http//server
  /quicklaunch)
• SPWeb quickLaunchWeb quickLaunchSite.OpenWeb()
  
• SPNavigationNodeCollection quickLaunchNodes
  quickLaunchWeb.Navigation.QuickLaunch
• SPNavigationNode internalMenuItem new
  SPNavigationNode(Links, Lists/Links/AllItems.as
  px, false)
• quickLaunchNodes.AddAsFirst(internalMenuItem)
• SPNavigationNode externalMenuItem new
  SPNavigationNode(SharePoint Experts,
  http//www.SharePointExperts.com, true)
• quickLaunchNodes.AddAsFirst(externalMenuItem)
• quickLaunchWeb.Update()

Source Todd Baginskis Blog
17
Code Snippet Example 2
Source Todd Baginskis Blog
18
Must Have for Navigation Development

• Todd Baginski's SharePoint Navigation Demo -
  http//www.sharepointblogs.com/files/folders/tbagi
  nski/entry10255.aspx

19
Putting It All Together

• Codeplex - Navigation Custom Control for
  Microsoft Office SharePoint Server (MOSS)
• The custom control uses a PortalSiteMapProvider
  to render a vertical navigation. Unlike the
  out-of-the-box AspMenu, it does not emit table
  tags, but list tags customizable using CSS
  classes. The navigation expands the root nodes
  and all parent nodes to the current node. A node
  can be a sub-site or a page.
• This is an example starting point for custom
  navigation development it is not a deployable
  solution! Consider it a framework!

20
Custom Navigation Control

• Installation
• Add files to a Visual Studio 2005 Class Library
  project
• Compile the project to a strong named assembly
• Copy the assembly either to the bin directory of
  your web site or to GAC. If the bin directory is
  used, modify web.config to use a custom or
  WSS_Medium trust level
• Add a SafeControl entry containing the assembly
  in your site's web.config
• Insert custom control to your site master pages
  or page layouts

21
Summary

• There is lots that you can with .NET development
  to extend or control user site navigation
• Functionality can be built into site
  provisioning, custom web parts, and/or custom
  controls
• Dont forget about cross-browser compatibility
  and security trimming requirements
• Use CSS references and take aesthetics out of the
  coding when possible
• For internally facing applications, discourage
  advanced navigation controls invest time and
  resources elsewhere

22
Resources

• Customize site navigation - http//office.microsof
  t.com/en-us/sharepointtechnology/HA101191001033.as
  px
• Plan site navigation (Office SharePoint Server) -
  http//technet.microsoft.com/en-us/library/cc26295
  1.aspx
• Todd Baginskis HOW TO Programmatically
  customize site navigation in WSS 3.0 and MOSS
  2007 - http//www.sharepointblogs.com/tbaginski/ar
  chive/2007/12/26/how-to-programmatically-customize
  -site-navigation-in-wss-3-0-and-moss-2007.aspx
• Codeplex Navigation Custom Control for Microsoft
  Office SharePoint Server (MOSS) -
  http//www.codeproject.com/KB/sharepoint/MossVerti
  calNav.aspx

23
Your Feedback is Important

• Please fill out a session evaluation form and
  either put them in the basket near the exit or
  drop them off at the conference registration
  desk.
• Thank you!