Skip Ribbon Commands
Skip to main content

MS-55010 - SharePoint Designer 2010 - Customizing and Branding

Price:

Duration: 3 Days

Audience:

Level:

Technology:

Delivery Method:

Software Assurance Value:

Microsoft CPE:

Course Information

Course Description

​This three-day instructor-led course provides students with the knowledge and skills to quickly make a SharePoint site your SharePoint Site. While focused on SharePoint Designer, this class covers SharePoint site customization, in particular, customization that can be done without custom code or SharePoint server access. This includes browser based customization, SharePoint Designer customization, InfoPath customization of list forms and the Data View and Content Editor web parts. Topics include how to customize navigation, themes, and master pages and how to get a start on branding. Also covered are how do customize the display of lists and libraries and how to connect data external to your site. Note: This class does not cover workflows

Course Objectives

​After completing this course, students will be able to:

  • Choose the best tool to use for each type of customization (Designer? The Browser? InfoPath, Visual Studio?)
  • Use SharePoint Designer for site administration
  • Understand how HTML, CSS and JavaScript are used to deliver the SharePoint user interface
  • Know when to edit a web part, a page or a master page
  • Get started with branding a site
  • Use the Data View Web Part to create custom views and reports
  • Use the Content Editor Web Part to display formatted text and apply CSS and JavaScript to a page
  • Work with external data (Data View Web Part, RSS feeds, data from other SharePoint sites, BCS, External Lists)

Course Audience

​Site Owners, Developers and Admins for SharePoint 2010 and SharePoint Online.

Course Outline

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.
Lessons
    • Who is this class for?
    • Why Do You Customize?
    • Customization Options
    • Who Customizes?
    • What about your SharePoint Governance Plan?
    • SharePoint Customization Tools
    • SharePoint Architecture
Lab1 Create Lab subsite
    • Explore the lab environment
    • Create a subsite for future labs and add sample lists, libraries and content
    • Explore items that may benefit from customization

Module 2: A Review of Browser Based Customization

This module explains how use the browser based customization features and how to not “reinvent the wheel”.
Lessons
    • Browser Based Customization - Look and Feel
    • Title, Description and Iocn
    • Site Theme
    • Navigation
    • Top Link Bar and Quick Launch Navigation
    • Links lists and other site navigation
    • The Content Editor Web Part
Lab: Browser Based Customization
    • This lab is a review and refresher on the built-in "browser based" customization points available in SharePoint.
    • Changing the site title and icon
    • Customizing the site’s navigation
    • Explore uses of the Content Editor Web Part
After completing this module, students will be able to:
    • Perform common browser based site customizations.

Module 3: SharePoint Designer Overview

This module introduces SharePoint Designer 2010 and explores its integration with SharePoint.
Lesson
    • Overview
    • Launching SharePoint Designer
    • Opening a Site from Site Actions or the Ribbon
    • Opening a Site from the Windows Start Button
    • Connecting to Remote Sites and Office 365
    • Possible Connection Errors
    • SharePoint Designer Navigation
    • Quick Access Toolbar
    • SharePoint Components and Structure
    • Rolling back changes
    • Keeping in Sync While Working in Both Designer and the Browser
Lab 1: Exploring SharePoint Designer
    • Launching SharePoint Designer
    • Opening Sites
    • Exploring the Ribbon and Panes
    • Editing a Page
After completing this module, students will be able to:
    • Launch SharePoint from Windows or a SharePoint Site.
    • Configure SharePoint Designer Options.
    • Navigate site content.
    • Edit a SharePoint page.

Module 4: SharePoint Administration

This module reviews the site administration features of SharePoint Designer. SharePoint Designer has become more than a page editor. Today you can do almost all of the site administration normally done in the browser from within SharePoint Designer.
Lessons
    • Creating lists and libraries and updating their settings
    • Uploading, managing and deleting library files and folders
    • Creation and Maintenance of subsites
Lab 1: Working with Lists and Libraries
  • Creating new lists and libraries
  • Working with list and library properties
  • Working with library content
  • Working with Content Types and Site Columns
  • Creating subsites
    • How HTML is used in SharePoint
    • Master Pages vs. Content Pages
    • HTML vs. SharePoint and ASP.Net Controls
    • How JavaScript is used in SharePoint
    • SharePoint's JavaScript Libraries
    • Adding Your Own Custom JavaScript
    • How CSS is used in SharePoint
    • Where to Store Your Custom CSS File
    • Exploring SharePoint CSS
    • Tools to Explore HTML and CSS
    • Examples of using CSS
    • Using SharePoint Designer’s HTML editor
    • Adding Custom CSS to a Master Page
    • Adding Custom JavaScript to a Content Page
    • Using Browser Developer Tools
    • Explore and edit HTML using SharePoint Designer.
    • HTML Controls
    • ASP.NET Controls
    • SharePoint Controls
    • Using the ASP.NET AdRotator control
    • Using and styling the asp:Menu control
    • Using Sharepoint:SPSecurityTrimmedControl
    • Add and configure common HTML controls.
    • Add and configure supported ASP.Net controls.
    • Add and configure SharePoint controls.
    • SharePoint Pages
    • The Home Page
    • Securing Pages
    • Creating SharePoint Wiki Pages
    • Creating SharePoint Web Part Pages
    • Creating SharePoint Publishing Pages
    • Creating SharePoint Wiki Pages
    • Creating SharePoint Web Part Pages
    • Creating SharePoint Publishing Pages
    • Create SharePoint Wiki Pages.
    • Create SharePoint Web Part Pages.
    • Create SharePoint Publishing Pages.
    • 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
    • Adding and Reusing a Content Editor Web Part
    • Adding HTML, CSS and JavaScript using a Content Editor Web Part
    • Create, use and reuse a Content Editor Web Part to display text and to embed HTML, CSS and JavaScript.
    • Navigation in SharePoint
    • Hide Content Based on User Permissions
    • The Quick Launch Area
    • Quick Launch Customization
    • Creating “Flyout” menus
    • Styling Quick Launch
    • Tree View Customization
    • Control what is displayed in the Tree View
    • Change the Site Content Link
    • Styling the Tree View
    • And more…
    • Creating a Static Menu That Looks Like a SharePoint Menu
    • Customizing Quick Launch
    • Customizing the Tree View
    • Customize the display of Quick Launch.
    • Control what is displayed in a Tree View.
    • Master Pages in SharePoint
    • Master Pages vs. Themes
    • Out of the Box Master Pages
    • Uploading and Using Master Pages
    • Master Page Placeholders
    • Starter Master Pages
    • What is Branding?
    • Creating a New Master Page from a Starter Master Page
    • Exploring Master Pages and Placeholders
    • Adding Content Pages
    • Switching Master Pages
    • Uploading and Applying Master Pages
    • Creating a New Master Page
    • Select and apply a master page.
    • Upload master pages.
    • Create new master pages.
    • Data View Web Parts
    • Moving Beyond Basic List Views
    • Editing Data View Web Part XSLT
    • Create a Data View to color highlight a task list
    • Create a Data View to group more than three levels
    • Create a Data View with custom XSLT
    • Use Data View Web Parts to create custom views of SharePoint lists.
    • Accessing External Data
    • SharePoint Designer Data Sources
    • Connecting to Lists in Another Site
    • Creating a Data View for a Custom External RSS Feed
    • Displaying Data from an XML File
    • Using Data Views for SharePoint Lists
    • Using Data Views for RSS Feeds
    • Using Data Views to Display XML Files
    • Display data external to a SharePoint site by using a Data View Web Part.

Module 5: How SharePoint uses HTML, CSS and JavaScript

This module explains how SharePoint is built from HTML, CSS and JavaScript and how pages are built using Master Pages, content pages, ASP controls and SharePoint Controls. This module also introduces CSS and JavaScript customizations.
Lessons
Lab 1: HTML, CSS and JavaScript
After completing this module, students will be able to:

Module 6: How SharePoint Uses ASP.NET and SharePoint Controls

This module explains how SharePoint uses ASP and SharePoint controls to build navigation and general SharePoint Content.
Lessons
Lab 1: Using ASP.NET and SharePoint Controls
After completing this module, students will be able to:

Module 7: Creating and Customizing Pages

This module explains how to create and use Wiki pages, Web Part pages and Publishing pages.
Lessons
Lab 1: Creating and Using SharePoint Pages
After completing this module, students will be able to:

Module 8: Content Editor Web Part

This module explains how to using the Content Editor Web Part to display text and to embed HTML, CSS and JavaScript.
Lessons
Lab 1: The Content Editor Web Part
After completing this module, students will be able to:

Module 9: Customizing SharePoint Navigation

This module explains how to customize SharePoint navigation, including Quick Launch and Tree View Tricks.
Lessons
Lab 1: Customizing SharePoint Navigation
After completing this module, students will be able to:

Module 10: SharePoint Master Pages and an Introduction to Branding

This module explores the use of master pages in SharePoint sites and explains how to customize and create new master pages.
Lessons
Lab 1: Master Pages
After completing this module, students will be able to:

Module 11: Data View Web Part - Creating Custom Views

This module explains how to use SharePoint Designer Data View Web Parts to create views and reports of SharePoint data beyond what is possible with out of the box views.
Lessons
Lab 1: Data View Web Part Custom Views
After completing this module, students will be able to:

Module 12: Working with External Data

This module explains how to create Data View Web Parts to access data external to a SharePoint Site.
Lessons
Lab 1: Creating Data View Web Parts
After completing this module, students will be able to:

Course Prerequisites

​Before attending this course, students must:

  • Have a strong background in SharePoint 2010 as both an end user and as a Site Owner or Site Collection Administrator
  • Know how to create subsites, create custom lists, add custom columns and create views
  • Have basic skills in HTML and CSS
  • A basic knowledge of JavaScript is helpful
We strongly recommend the following courses:
  • MS-50470 - Microsoft SharePoint Server 2010 for the Site Owner/Power User
  • MA-1022 - HTML and CSS using SharePoint Designer 2010
Course Schedule
This course is not scheduled yet.