1. SharePoint Designer 2010 Customizing and Branding SharePoint 2010 and Office 365
10/13/ A MAX Technical Training

2. Module 1: SharePoint Customization
This module provides an introduction to the topics covered in the class, defines the roles of customizers, defines the terminology used in the class and introduces the customization tools.
Who is this class for?
Prerequisites?
Why Customize?
Who Does Customization?
SharePoint Architecture and What Can be Customized?
10/13/ A MAX Technical Training

3. Who is this class for?
This class is for the SharePoint user who needs to:
Change the appearance of a SharePoint site
Access to data that exists outside of their site
Customize list forms and views
Create subsites and workspaces
Enhance the display of SharePoint data
10/13/ A MAX Technical Training

4. Prerequisites You will need:
Basic web development skills, including HTML, CSS and JavaScript (the more the better)
Good SharePoint end-user skills including:
Site customization from the browser (Site Actions, Site Settings)
Library customization: Document, Form (InfoPath), Wiki, Picture, Slide (PowerPoint slide library) libraries
List customization: Tasks, Links, Calendars, Surveys, Announcements, Contacts, Discussion lists
How to adding content to lists and libraries
How to upload content
A good understanding of your organization's security, legal and business requirements for content that you will be storing in SharePoint
Knowledge of your organization’s governance policies on SharePoint customization
10/13/ A MAX Technical Training

5. Why Do You Customize? To “Brand” sites and change the Look and Feel
The site needs to display the corporate image: colors, logos, navigation
The site needs to look like an existing site
The site needs to look like anything but SharePoint
10/13/ A MAX Technical Training

6. Why Do You Customize? To display non-SharePoint data
Data from other SharePoint sites
Data from SQL Server and other databases
Data from XML sources
Data from external sources (corporate systems and the internet)
10/13/ A MAX Technical Training

7. Why Do You Customize? Incorporate Custom ASPX Pages Dashboards Reports
Data entry forms
Custom applications
10/13/ A MAX Technical Training

8. Customization Options
There are at least three tiers of customization:
Configuration:
The changes you can do from a browser.
Customization:
Anything that can be done without deployment of files to the SharePoint servers. Customization is typically done using SharePoint Designer.
Custom Development
Custom development includes any work that requires changes or file deployment to the SharePoint web servers. Much of this kind of work is performed with Visual Studio 2010.
10/13/ A MAX Technical Training

9. Who Will Do the Customization?
Graphic Designer
Generally starts with an HTML / CSS design and then modifies it to work with SharePoint
Creates new and custom HTML and CSS
Creates new themes and master pages
Site Owner
Generally adapts a SharePoint design to departmental needs
Makes minor modifications to master pages and site pages
Tweaks HTML and CSS
Creates Data Form Web Parts
Tweaks existing SharePoint controls
Developer
Creates custom web parts
Creates custom workflows
Creates custom Themes and Site Definitions
Creates custom Features (plug and play additions to SharePoint)
Creates custom ASPX pages
10/13/ A MAX Technical Training

10. Customization Decisions
Do you have a governance plan?
Should you customize Master Pages or Themes?
Will your changes will impact a single site or all sites?
Can work only be done in a production environment, or must changes be first made in a development environment?
Must these changes also work in the next version of SharePoint?
Should you document your changes somewhere?
10/13/ A MAX Technical Training

11. SharePoint Customization Tools
The web browser
SharePoint Web Parts
SharePoint Designer
InfoPath
Visual Studio
10/13/ A MAX Technical Training

12. SharePoint Architecture
Where SharePoint data (pages, files, etc.) is stored determines if SharePoint Designer can be used to edit the data.
Files stored directly on the server cannot be edited in SharePoint Designer
10/13/ A MAX Technical Training

13. SharePoint Architecture
 Examples…
Can be edited from SharePoint Designer
Requires access to the web server directories
Site templates accessible to all site collections (Site Definitions)  
Theme and CSS overrides
Custom web parts created from Data Form Web Parts
Web parts requiring custom code (VB.Net, C#, etc)
Features
Workflows – simple
Workflows – complex
SharePoint templates for alerts
SharePoint mobile views
SharePoint error message page
10/13/ A MAX Technical Training

14. Module 2: A Review of Browser Based Customization
Here we will explore how use the browser based customization features.
10/13/ A MAX Technical Training

15. Don’t Reinvent the Wheel!
SharePoint includes many features in the browser interface to support site customization by the owners of the sites. These features include:
Site title, description and icon / logo
Master page selection (for Publishing sub-sites)
Navigation
Tabs
Quick Launch
Tree View
Links lists and links web parts
Site theme selection
Don’t break these features with your customizations!
10/13/ A MAX Technical Training

16. Let’s take a tour… Title, Description and Icon Site Theme Tree View
Top Link Bar and Quick Launch Navigation
Links lists and other site navigation
Speaking of navigation… Does your organization have navigation standards?
10/13/ A MAX Technical Training

17. Web Parts for Customizers
The Content Editor Web Part
This web part can be used to embed JavaScript, CSS, Flash, Silverlight and other HTML based technologies
The Content Query Web Part
This web part can display content from other sites in the site collection and rollup content from multiple sites into a single web part
The Data Form Web Part
This web part can be used to create views with features not available from browser created views and can display external data
10/13/ A MAX Technical Training

18. SharePoint Designer Overview
This module introduces SharePoint Designer 2010 and explores its integration with SharePoint.
10/13/ A MAX Technical Training

19. Launching SharePoint Designer
From the Windows Start button
From the List or Library ribbon
From Site Actions
From the Page ribbon
10/13/ A MAX Technical Training

20. Possible Connection Errors
Can’t open your site?
Cause: The SharePoint Server Administrator has disabled the use of SharePoint Designer at the web application level or the Site Collection Administrator has disabled the use of SharePoint Designer at the Site Collection level.
10/13/ A MAX Technical Training

21. SharePoint Designer Navigation
Quick Access Toolbar
Up to 27 commands can be added to this toolbar
Save
Undo and Redo
Refresh (F5) - used to resync SharePoint Designer to the current site when changes have been made to the site while the site is open in SharePoint Designer.
Stop the current operation
Preview in Browser - click the dropdown for options:
10/13/ A MAX Technical Training

22. SharePoint Designer Navigation
The Ribbon
Like most current Microsoft Office products and SharePoint 2010, SharePoint Designer 2010 has a ribbon.
The ribbon is dynamic and will change based on the last object clicked.
10/13/ A MAX Technical Training

23. SharePoint Designer Navigation
Working with Panes
SharePoint Designer 2010 uses two different kinds of panes or panels.
The Navigation pane cannot be closed, but can be collapsed by clicking the Collapse buttons.
Other panes will be automatically opened as needed and can be closed by clicking the X button. Double-click in the pane’s title bar to “float” the pane.
10/13/ A MAX Technical Training

24. SharePoint Designer Navigation
Tabs
As you open property pages and the various editors (HTML, CSS, etc) SharePoint Designer adds new tabs to the tab bar.
To close a tab, click the tab and then click the “x” at the far right.
Tabs with an “*” have unsaved content.
Clicking the “New Tab” tab will open a new panel showing site properties.
10/13/ A MAX Technical Training

25. SharePoint Designer Navigation
Split Views
Design – displays the page as (almost) rendered in a browser (For a true view of the page click the Preview In Browser button or press F12.)
Code – displays the HTML of the page
Split – displays both Design and Code views of the page
10/13/ A MAX Technical Training

26. SharePoint Components and Structure
SharePoint Designer exposes the virtual directory structure of SharePoint sites:
Even more site content can be explored from the All Files link in Site Objects:
The All Files folder can be “pinned” to allow tree view style browsing of the virtual directory structure.
10/13/ A MAX Technical Training

27. Rolling back changes When you save changes:
Customized pages are marked with in the folder view:
To undo all changes to a page Right-Click the customized file and select Reset to Site Definition.
10/13/ A MAX Technical Training

28. Keeping in Sync – Browser / Designer
In the browser - Click the link to the page in Quick Launch or click the browser's refresh button
In SharePoint Designer - Display the screen or list that is not up-to-date and click the Refresh button
In SharePoint Designer for a single page:
10/13/ A MAX Technical Training

29. Module 4: SharePoint Administration
SharePoint Designer 2010 is more than a page editor.
You can do almost all of the site administration normally done from the browser from within SharePoint Designer.
10/13/ A MAX Technical Training

30. Working with Lists and Libraries
Manage Lists and Libraries
Managing Files
Column Maintenance
10/13/ A MAX Technical Training

31. Content Types and Site Columns
Maintaining Content Types and Site Columns
External Site Columns
External Site Columns are covered in Module 12: Working with External Data
10/13/ A MAX Technical Training

32. Working with Sites Site Settings Site Permissions (adding users)
Creation and Maintenance of Subsites
10/13/ A MAX Technical Training

33. Module 5: How SharePoint uses HTML, CSS and JavaScript
SharePoint is built from:
HTML
CSS
JavaScript
Master Pages and Content Pages
ASP controls and SharePoint Controls
10/13/ A MAX Technical Training

34. How HTML is used in SharePoint
Everything you see in a SharePoint web page is built from HTML, CSS (Cascading Style Sheets), JavaScript and Silverlight.
Master Pages vs. Content Pages
HTML vs. SharePoint and ASP.Net Controls
10/13/ A MAX Technical Training

35. How JavaScript is used in SharePoint
SharePoint's JavaScript Libraries
SharePoint loads many JavaScript libraries To explore, display the page and view the source looking for <script> tags: <script type="text/javascript" src="/_layouts/1033/init.js? /script>
These can be downloaded and studied by editing the site’s URL:
10/13/ A MAX Technical Training

36. How JavaScript is used in SharePoint
Adding Your Own Custom JavaScript
If the JavaScript is needed by the master page, or otherwise needed "everywhere", then add it to the master page, typically in the <HEAD> section, or just before the </BODY> tag.
If the JavaScript is needed in just one page, edit the page in SharePoint Designer. Typically you would add the JavaScript just before the </asp:content> tag of the PlaceHolderMain section.
If the JavaScript is needed in just one page, and you don't want to use Designer, you can upload the JavaScript file to a library, add a Content Editor Web Part and use it to link to the uploaded file.
If the JavaScript is going to be used in several, but not all pages, upload the file to a library and link to it from a <SCRIPT> tag or from a Content Editor Web Part in each page.
10/13/ A MAX Technical Training

37. How CSS is used in SharePoint
Cascading Styles Sheets (CSS) are used to add formatting such as fonts, color, height and width.
COREv4.CSS – The primary CSS file. This file is located on the SharePoint servers and cannot be directly edited by SharePoint Designer . C:\Program Files\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\LAYOUTS\1033\STYLES
User uploaded CSS file (Publishing sites only)
Inline CSS in the Master Page and Content pages <style> … </style>
10/13/ A MAX Technical Training

38. How CSS is used in SharePoint
Where to Store Your Custom CSS File
If you have access to the SharePoint servers then you can store your final design here: C:\program files\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\LAYOUTS\STYLES
If you are using Publishing sites you can upload the CSS file from Site Actions, Site Settings, Master Page, Alternate CSS URL
Upload the CSS files to a library in your site – This is great for both testing and for final deployment when you don’t have access to the SharePoint servers.
10/13/ A MAX Technical Training

39. Demo Exploring SharePoint CSS
Tools to Explore HTML and CSS (Internet Explorer Developer Tools)
Playing with (testing!) styles
10/13/ A MAX Technical Training

40. Module 6: How SharePoint Uses ASP.NET and SharePoint Controls
How SharePoint uses ASP and SharePoint controls to build navigation and general SharePoint Content
10/13/ A MAX Technical Training

41. Web Controls Web Controls
HTML – These controls are not processed by SharePoint and are delivered to the browser exactly as you have typed them.
ASP.NET Controls - These controls are part of the technology used to create SharePoint, ASP.NET, and in most cases are of value to developers. These controls are processed by the web servers which replace the controls with dynamically created HTML.
SharePoint Controls - These controls are unique to SharePoint development and are processed the same as ASP.NET controls… the server converts them to dynamically created HTML.
10/13/ A MAX Technical Training

42. HTML Controls
All HTML controls from the HTML Ribbon button can be added to a SharePoint page.
HTML controls can be hand typed or added from the ribbon HTML dropdown.
To learn more about HTML controls refer to any good book on HTML or web sites such as
10/13/ A MAX Technical Training

43. ASP.NET Controls
Not all ASP.NET controls are useful in a SharePoint page. Many require the use of custom server side code created in Visual Studio.
Many like the Web Part Zones, the Ad Rotator and the asp:Menu are quite useful in SharePoint projects.
10/13/ A MAX Technical Training

44. SharePoint Controls
Most SharePoint controls are only of value to SharePoint's internal work and to SharePoint developers.
A few can be quite useful to customizers. An example is the SPSecurityTrimmedControl.
<Sharepoint:SPSecurityTrimmedControl runat="server"
PermissionsString="DeleteListItems">
If you can see this then you can delete stuff!
</SharePoint:SPSecurityTrimmedControl>
10/13/ A MAX Technical Training

45. Demo The Ad Rotator ASP.Net Control
The Ad Rotator requires three things:
Pictures! These can be stored in a picture library or any document library
An XML file with the list of the pictures and display information
The Ad Rotator control
10/13/ A MAX Technical Training

46. Module 7: Creating and Customizing Pages
Wiki pages
Web Part pages
10/13/ A MAX Technical Training

47. SharePoint Pages Wiki pages (two kinds) Web Part Pages ASPX Pages
Wiki library pages
Wiki site pages (the home page of a Team Site)
Web Part Pages
ASPX Pages
They by default do not use the SharePoint master page and therefore have no default navigation.
ASPX pages can be used to create custom reports, custom web part pages and can optionally use SharePoint master pages.
Layouts / Application Pages
Any page with "/_layouts" in its URL is a layouts or application page.
These pages are stored on the SharePoint servers and cannot be edited using SharePoint Designer.
10/13/ A MAX Technical Training

48. The Home Page
The home page of a site may be either a web part page or a wiki page, depending on the template used to create the site.
Home.aspx
Home.aspx is used in Team Sites and is stored in the Site Pages library. This page is a Wiki page.
Default.aspx
Default.aspx is used in a Blank Site and in most non-publishing sites except for the Team Site.
The default.aspx page is not stored in a library, but rather in the root folder of the site. This page is a web part page.
10/13/ A MAX Technical Training

49. Page URLs
Pages in libraries have the library's name in the URL:
Pages stored in the site root or in a SharePoint Designer created folder (rare) do not reference a library: or
10/13/ A MAX Technical Training

50. Securing Pages When a page is stored in a SharePoint library:
Security for pages is handled the same as security for documents
Users must at least have Read or View access to see a page
Unless security is customized, users with Contributor permissions, such as users in the Members group, will be able to add, edit and delete pages!
Libraries for pages have all of the features associated with document libraries: check in/out, versioning and content approval
Pages can be stored in any library. SharePoint provides a few special locations for pages:
The Pages library is the default library for the home page (default.aspx) and all publishing pages in a Publishing site
The Site Pages library is the default location for the home page (home.aspx) and most pages added to a Team Site.
10/13/ A MAX Technical Training

51. Creating SharePoint Wiki Pages
Wiki pages can only be created from the browser. (i.e. not from SharePoint Designer)
Using the browser:
Click Site Actions and then New Page
Enter a name for the page Note: the page is always saved to the Site Pages library, but can then be moved to any library
Type or paste content for the page and click Save and Close in the ribbon
10/13/ A MAX Technical Training

52. Creating SharePoint Web Part Pages
Using the browser
Click Site Actions, More Options…
Optional: click Page to filter the list of templates
Click Web Part Page and click Create
Enter a Name, select a layout and select a Library
Using SharePoint Designer
Click the File tab of the ribbon
Click Add Item and then Web Part Page
Select a Page Layout (example: Header, Footer, 3 Columns) and click Create
Enter a name for the page
10/13/ A MAX Technical Training

53. Creating SharePoint Publishing Pages
Publishing pages can only be created in a publishing site, either a site created from a publishing template or a site with the publishing features enabled after the site was created.
Publishing pages are stored in the Pages library.
From the browser:
Click Site Actions and More Options…
Optional: Click Pages to filter the list of templates
Click Publishing Page
Enter a Title, Description and URL
Select a template
Click Create
10/13/ A MAX Technical Training

54. Content Pages
A content page is always merged with a master page to generate the final HTML delivered to the user’s browser.
The home page of your site is an example of a content page.
Content pages:
Are always used with a master page
Always have an extension of .ASPX
Never have HTML outside of <ASP:Content> tags
Generally have at least one <ASP:Conent> tag (PlaceHolderMain) and may have many content tags
10/13/ A MAX Technical Training

55. Content Pages
Examples of content pages you can edit from SharePoint Designer:
Your home page:
The default view of the Shared Documents library:
The Add New Item page for Announcements
Examples of pages you cannot edit from SharePoint Designer: (Notice the _layouts in each URL)
"Modify view" for Announcements
Site Actions, Site Settings
10/13/ A MAX Technical Training

56. Demo
Creating a New Content Page from an ASPX Page Let’s take a look at converting an ordinary web page created in SharePoint Designer into a full fledged SharePoint page.
Modifying a Web Part Page Let’s add a new web part zone!
10/13/ A MAX Technical Training

57. Modifying a List or Library Page
Here a just a few of the many reasons to modify list and library pages:
Add custom text, such as legal disclaimers
Add data entry instructions
Customize the data entry forms
10/13/ A MAX Technical Training

58. Demo
Add custom text to a form Our users have been entering non-business items into the Announcements List. We would like to add some text about appropriate use to the top of the form.
10/13/ A MAX Technical Training

59. Module 8: Content Editor Web Part
Using the Content Editor Web Part to display text and to embed HTML, CSS and JavaScript.
The Content Editor Web Part
Using a Content Editor Web Part for Formatted Text
Reusing a Content Editor Web Part
Using a Content Editor Web Part for HTML, CSS and JavaScript
10/13/ A MAX Technical Training

60. The Content Editor Web Part
The Content Editor Web Part (CEWP) is designed primarily to add formatted text and images to web part pages.
Its less obvious role is to inject special HTML, CSS and JavaScript code into a page without using SharePoint Designer.
Examples of using the CEWP:
Add a Welcome message to a web part page
Add CSS code to impact a single page – Example: change the title bar color of all web parts on a page
Add JavaScript to color code a task list or calendar
Add JavaScript to display SharePoint list as a chart
10/13/ A MAX Technical Training

61. The Content Editor Web Part
Warning:
Extra Web Parts will “break” View Pages
SharePoint 2010 treats view pages with added web parts as “non-views” and removes many view related features.
This page has an extra web part and is now missing the View dropdown in the ribbon.
10/13/ A MAX Technical Training

62. Using a CEWP for Formatted Text
Text can be added to a CEWP three ways:
by direct typing and using the ribbon
by editing the HTML of the web part
by linking to a file that contains the text and HTML formatting
You can:
Add and format text
Insert hyperlinks and tables
Insert pictures
Select text styles
10/13/ A MAX Technical Training

63. Demo Using a CEWP for Formatted Text
10/13/ A MAX Technical Training

64. Using a CEWP for HTML, CSS and JavaScript
Using the ribbon button…
You may see this message after editing HTML using the ribbon button:
10/13/ A MAX Technical Training

65. Using a CEWP for HTML, CSS and JavaScript
Using a linked file
The best way to deal with the “Might have been modified” issue… don’t use that button!
Instead, store the HTML, CSS and JavaScript in a text file, upload that file to a library and then link to the file.
10/13/ A MAX Technical Training

66. Demo Using a linked file with the CEWP
Reusing a Content Editor Web Part
10/13/ A MAX Technical Training

67. Module 9: Customizing SharePoint Navigation
Customizing SharePoint navigation, including Quick Launch and Tree View tricks
10/13/ A MAX Technical Training

68. Navigation in SharePoint
In a web site navigation is anything a user can click on that takes them to another web page.
The primary navigation options in SharePoint include:
Top Link Bar
Quick Launch
Title area crumb trail
Site Actions
Secondary navigation options include:
a links list on the home page
links added to the home page content
links in Announcements and the Content Editor Web Part
custom JavaScript tree view, tab and menu controls
links in Silverlight Controls
10/13/ A MAX Technical Training

69. Quick Launch Area
The Quick Launch area is more than just Quick Launch:
The All Site Content link
The Recycle Bin link
Quick Launch menu (The Quick Launch control is built from a .Net AspMenu control.)
The Tree View (hidden by default)
When the calendar is displayed, the Calendar Navigator is displayed just above the All Site Content link
When wikis, and some libraries are displayed, a Recently Modified panel is displayed
10/13/ A MAX Technical Training

70. Demo Controlling who can see All Site Content PermissionsString=“???”
10/13/ A MAX Technical Training

71. Hide Content Based on User Permissions
When is a link in Quick Launch “security trimmed” or hidden based on user permissions?
SharePoint will create the security trimmed link:
When you create a new list or library, you click More Options and click “Display this list on Quick Launch”
When you edit the properties of the list or library and in Title Description and Navigation click “Display this list on Quick Launch”
Manually added links (Site Actions, Site Setting) are not security trimmed!
10/13/ A MAX Technical Training

72. SPSecurityTrimmedControl
The SPSecurityTrimmedControl can be used to selectively hide anything on the page by the permissions of the user.
Set the PermissionsString to match the rights of the user who you want to see the content.
The SPSecurityTrimmedControl will only work when added directly the Code View of the page using SharePoint Designer. (I.e. will not work in a CEWP.)
<Sharepoint:SPSecurityTrimmedControl runat="server"
PermissionsString="DeleteListItems">
If you can see this then you can delete stuff!
Put special navigation links here that should only be seen by people who can delete content…
</SharePoint:SPSecurityTrimmedControl>
10/13/ A MAX Technical Training

73. Quick Launch Customizations
Quick Launch is built from a SharePoint enhanced version of the ASP Menu control.
You can:
Restyle the menu
Tighten up the display, change colors, fonts, etc.
Create "pop out" menus
You can also create Quick Launch style menus from ASPMenu controls by applying the Quick Launch styles.
10/13/ A MAX Technical Training

74. Demo Use CSS to remove some of the white space in Quick Launch
Change Quick Launch to use "pop out" menus
Use CSS to change the fonts and colors in Quick Launch
10/13/ A MAX Technical Training

75. Tree View Customizations
The Tree View customizations:
Change the fonts and colors using CSS styles: SelectedNodeStyle-CssClass and NodeStyle-CssClass
Change the icons used to expand and collapse sections: ExpandImageUrl, CollapseImageUrl and NoExpandImageUrl
Change the default levels of Expansion – Default is "0"
Change the node indent – Default is 12 pixels (NodeIndent="12")
Add lines to better show parent / child relationships
Choose the content to display: ShowDocLibChildren, ShowFolderChildren, ShowListChildren, ShowWebChildren
10/13/ A MAX Technical Training

76. Demo Change the Tree View to: Show only libraries
Pre-expand the folders to 3 levels deep
10/13/ A MAX Technical Training

77. Module 10: SharePoint Master Pages and an Introduction to Branding
Branding is an art that requires graphical design skills along with user interface design expertise. As such, a full discussion of branding is beyond the scope of this class.
Here we will cover several skills a “brander” will need:
Working with master pages
Placeholders
CSS
Working with content pages.
10/13/ A MAX Technical Training

78. Master Pages in SharePoint
A master page:
has a file extension of .master and can never be displayed by itself (A visitor to your site cannot navigate to v4.master or default.master)
is always used in combination with a content page (Your home page is a content page that is loaded inside of a master page.)
contains the primary page layout HTML including the <HTML>, <HEAD> and <BODY> tags along with all layout HTML needed for the page
includes, or links to, the CSS and JavaScript shared by all the content pages
has <ASP:ContentPlaceHolder> tags to mark where the content pages can insert their content.
10/13/ A MAX Technical Training

79. Content Page Basics
A content page has no HTML outside of <ASP:Content> tags - the master page supplies the rest of the HTML needed for the page
A content page has one or more <ASP:Content> tags that contain the data unique to the page
An empty <ASP:Content> tag will hide the default content supplied by the master page for that location
10/13/ A MAX Technical Training

80. Master Pages vs. Themes
Master Pages provide the overall page structure and layout.
Themes provide colors, fonts and images.
Master Pages are created using SharePoint Designer.
Themes are created by using PowerPoint.
Both can be purchased or downloaded from the web.
10/13/ A MAX Technical Training

81. Out of the Box Master Pages
Common master pages:
v4.master - the default master page for most sites
default.master - a SharePoint 2007 style master page initially used for sites upgraded from 2007 to 2010 (has no ribbon!)
minimal.master - a simple master page used for pages that do not need navigation (a basic search page for example)
A publishing template based site collection also includes:
nightanday.master
Meeting workspace sites include:
MWSDefault.master
MWSDefaultv4.master
10/13/ A MAX Technical Training

82. Master Page Galleries
Master pages are stored in galleries (special libraries)
For non-publishing sites the gallery is named "Master Pages"
For publishing sites the gallery is named "Master pages and page layouts"
10/13/ A MAX Technical Training

83. Uploading and Using Master Pages
Master pages can be simply uploaded to the Master Page Gallery:
Selecting a Master Page
select the master page from the Master Page link in Site Actions, Site Settings, Look and Feel (publishing sites only)
right-click the master page in SharePoint Designer and select Set as Default Master Page
10/13/ A MAX Technical Training

84. Master Page Placeholders
The areas of a master page that will receive content from a content page are called placeholders and are added to a master page with <asp:ContentPlaceHolder> tags.
Every standard SharePoint placeholder must be added to your custom master page.
Your content pages only need to define placeholders you want to override.
You can create your own additional placeholders.
10/13/ A MAX Technical Training

85. Starter Master Pages A starter master page needs at least:
All content placeholders
Core CssLink / ScriptLink / RobotsMetaTag controls
The WebPartPages:SPWebPartManager control
The Site Actions dropdown
The <wssuc:DesignModeConsole> control
The FormDigest control
Sources of Starter Master pages:
and do a web search for "SharePoint 2010 starter master pages"
10/13/ A MAX Technical Training

86. Creating a New Master Page from a Starter Master Page
Start out with an HTML mockup of the site
Is the design usable as is?
What SharePoint functionality do you need and will it work in this design?
Start with a starter master page
Migrate the HTML code into the starter page
Move and style the SharePoint controls and placeholders
Test, test, test!
10/13/ A MAX Technical Training

87. Module 11: Creating Custom Views
How to use XSLT List View Web Parts and SharePoint Designer Data Form Web Parts to create views and reports of SharePoint data beyond what is possible with out of the box views.
10/13/ A MAX Technical Training

88. XSLT List View Web Part vs. Data Form Web Parts
XSLT List View Web Parts (XLV)
Used by default for all lists and libraries in a site. They are automatically created when list views and list web parts are added to a site, either from the browser or from SharePoint Designer (Insert Tab, Data View).
Automatically include column headings that can be used to sort and group data.
Can be customized from the browser or SharePoint Designer
Group on up only two levels (Region and Country but not Region, Country, State, and City)
10/13/ A MAX Technical Training

89. XSLT List View Web Part vs. Data Form Web Parts
Data Form Web Parts (DFWP)
Only created from SharePoint Designer
Can display and edit data from external sources including databases, XML files, web services and lists and libraries from other sites
Only adds text column headings by default (but sorting and filtering can be enabled)
Cannot be customized from the browser
Group on up sixteen levels (Region, Country, State, City and more)
10/13/ A MAX Technical Training

90. XSLT List View Web Part vs. Data Form Web Parts
With SharePoint Designer both can also:
Format data - colors, fonts, styles
Conditionally format data - example: change the color of a row based on a value
Format data unconventional ways by customizing the XML data returned by SharePoint using XSLT transforms
10/13/ A MAX Technical Training

91. Demo Displaying a List Using a Data Form Web Part
Review the XSLT in the code panel
An XSLT Customization
10/13/ A MAX Technical Training

92. Module 12: Working with External Data
Creating Data Form Web Parts to access data external to a SharePoint Site
10/13/ A MAX Technical Training

93. External Data Accessing SharePoint Data External to Your Site
Most SharePoint functionality is limited to a single site. SharePoint Designer can be used to create Data Sources that point to other SharePoint sites and then use these Data Sources to supply data to Data Form Web Parts.
Accessing Data External to SharePoint
Microsoft SQL Server
Other databases using OLE DB
Web Services
RESTful web services
XML data files
RSS feeds
And by using the Business Connectivity Services, access data from just about anywhere.
10/13/ A MAX Technical Training

94. External Data Your ability to access external data may be limited by:
Your company’s policies for access to both internal and external data (this may be defined in your SharePoint governance plan)
Your security rights for certain databases
Ports and sites blocked by your corporate firewalls
10/13/ A MAX Technical Training

95. External Data Authentication
Many data sources accessible from a Data View require authentication configured by your network and server administrators.
Some of the options to support user authentication to data sources include
Business Data Catalogs,
Single Sign On services (SSO),
Kerberos authentication
and proxy server configurations, All of which are outside of the scope of this class.
Unable to display this Web Part. To troubleshoot the problem, open this Web page in a Windows SharePoint Services-compatible HTML editor such as Microsoft Office SharePoint Designer. If the problem persists, contact your Web server administrator.
10/13/ A MAX Technical Training

96. SharePoint Designer Data Sources
Linked Data Source - used to merge several connections into one - example: merge several task lists
Database Connection - used to connect to SQL Server and OLE DB sources - these connections will usually require SQL administrator support to configure the connection and permissions.
SOAP Service Connection - used to connect to both SharePoint and public SOAP web services. This is often used with the SharePoint lists.asmx web service to provide access to lists and libraries in other sites and site collections.
REST Service Connection - used to access SharePoint REST services and external RSS feeds (REST = Representational State Transfer)
10/13/ A MAX Technical Training

97. Connecting to Lists in another SharePoint Site
To connect to a list in another site:
Need to call a SharePoint web service…
Create a SOAP Service Connection to the other site’s LISTS web service
Create a Data View web part from the data source
10/13/ A MAX Technical Training

98. Demo Connecting to a list in another SharePoint Site
Create the connection
Create the Web Part
Creating a Data View for a Custom External RSS Feed
(if internet access is available)
10/13/ A MAX Technical Training

99. Displaying Data from an XML File
To work with and display XML files:
Either upload the XML file to a SharePoint library or to a location accessible using an HTTP URL.
Add a Data Source to SharePoint Designer that points to the XML file
Insert a blank Data Form Web Part
Click the link to add data and select the data source
Select, insert and format fields
10/13/ A MAX Technical Training

100. Demo Displaying Data from an XML File
10/13/ A MAX Technical Training