C/D/H shares expert advice for advanced-level SharePoint designers and developers. View our Mastering SharePoint Design slide deck to learn more about architecting branding solutions and creating branding features, including the anatomy of a custom feature and deployment. And for more information on this or other SharePoint topics, visit our blog at www.cdhtalkstech.com.

1. Mastering your SharePoint
Internet design

2. Quick Facts
About Us Approach Partnerships
• 22nd Year • Vendor • Microsoft Gold
• Grand Rapids & Independent • VMware Enterprise
Royal Oak • Non-reseller • Citrix Silver
• 30 Staff • Professional • Cisco Registered
Services Only • Novell Gold

3. Expertise

4. Microsoft Gold Partner
Competencies Successes Pinpoint
• Four Gold • Customer Excellence • Microsoft’s official
• Eight Silver Award partner directory
• Virtual Technical • 5-star rating
Specialist (VTSP)
• Managed Partner
• Numerous Partner
Awards

5. Get Social with C/D/H
C/D/H Talks Tech C/D/H Tweets Tech

6. Your Presenter
Jeff Kinnelly
Consultant, Design / Development
JeffK@cdh.com

7. Agenda
• Architecting Branding Solutions
– On Premise
– In the Cloud
• Creating Branding Features
– Anatomy of a Custom Branding Feature
– Deployment
• Q&A

8. Overall Project Strategies

9. Branding Approaches
Public websites
– Light informational websites (60-100 hours)
– Enterprise websites (300-1000+ hours)
Intranets
– Custom themes (12-20 hours)
– Low-impact designs (25-100 hours)
– Fully custom solutions (300-1000+ hours)

10. General Branding Guidelines
• Office 365 solutions
– Doesn’t use SP Central Admin
– No farm deployments
– Sites inherit branding from the root collection
– My Sites cannot be branded
– Is the model for SP 2013 (sandboxed solutions)

11. Common Goals for Branding
Projects
• Common Goals for Branding Projects

12. Master Pages + Page Layouts

13. Master Page
Page Layout
Master Page

14. SharePoint Front-end:
How the Site is Built

15. Master Pages
• Team site master page
v4.master • User content pages (listscontent pagesetc)
• _layouts pages (site settings, etc)
• For app experiences, like Search or Office Web Applications
minimal.master • If you do not need site navigation, do not have a ribbon
• If your app needs the space
• For error pages or login pages
simple.master • Not customizable, but pages can be replaced
• Show site using legacy interface
default.master • No Ribbon, no fluency

16. Where Are They Stored?
• Global directory in the 12 or 14 hive
– Located on the web front end (WFE) server
– C:Program FilesCommon FilesMicrosoft
Shared14TemplateGlobal
– Pointer to 12/14 hive is stored in the Master
Page Gallery
• Master Page Gallery in a Site Collection
– Located in the content database (database
server)

17. Development Tools
• SharePoint Designer 2010
– WYSIWYG, ASP/HTML/CSS code, deployment
• Visual Studio 2010
– ASP/HTML/CSS code, solution development,
deployment
• IE Developer Toolbar
– Debugging, identifying CSS elements
• Photoshop
– Image creation/manipulation, color selection
• GIMP
– Image creation/manipulation, color selection
• Notepad

18. SharePoint Development in VS2010
• SharePoint 2010 item templates
– Web Part, Workflow, Module, Content Type, List Definition, etc.
• Automated build and deployment
• File references and modules (sets of files)
– Once files are added to the solution, references automatically
appear in the element files
– Modules are automatically added to feature elements
• Sandboxed solutions
– Live in the site collection
– Can be run by site administrators
– Can only manipulate a subset of objects in SP object model
– Performance can be throttled

19. Master Page Deployment Options
• Manual deployment to the Master Page Gallery
– Followed by a manual application of the master page
– Does not require Visual Studio
OR
• WSP solution deployment to the Site or Farm
solution store
– Followed by an automated application via a Feature
Kanwal Khipple - BrightStarr

20. Elements in a Master Page
Solution
• Module
– Group of files to be provisioned
• .master files, CSS files, images
– Elements.xml file specifies where file will be
provisioned to
• Feature
– Facilitate the provisioning/de-provisioning of
master pages
• Event Receiver
– Piece of code that runs when feature is activated
– Can be used to apply the master page to sites
Kanwal Khipple - BrightStarr

21. Where to Start
• Start with a copy of V4.master (or minimal.master
if you do not need the ribbon or top nav)
• Create a new CSS file, and copy/paste the
elements you wish to modify from COREV4.css
• Create a module for the CSS files and master
page file
– CSS files should be provisioned to the Style Library or to
the 14 hive
– Master pages should be provisioned to the Master Page
Gallery or to the 14 hive
http://msdn.microsoft.com/enus/library/gg447066.aspx
Kanwal Khipple - BrightStarr

22. Images and Styles
• Images and CSS files can be provisioned to a library within
the site collection (i.e. Style Library), or to the 14 hive (.i.e.
IMAGES folder)
• Provisioning to a library
– Advantages: Site admins can easily modify files
– Disadvantages: Each page load will require calls to the DB for
the images and styles
• Provisioning to the 14 hive
– Advantages: WFE server can cache file for faster loading
– Disadvantages: Modification of files will require another
deployment, or access to the 14 hive in the WFE
• Personal recommendation
– Deploy images to the IMAGES folder in the 14 hive, and CSS
files to the Style Library in the root site of the site collection

23. Custom Ribbon Fonts & Styles
.ms-rteStyle-BlueBackground {;
background-color: blue important!;
color: white; H1.ms-rteElement-H1Blue {
} color: blue important!;
}

24. Demo
Building a Brand Feature

25. Upcoming SharePoint Events
September 19: Business Intelligence in
SharePoint
September 26: West Michigan
SharePoint User Group Meeting
September 29: SharePoint Saturday
October 17: SharePoint vNext

26. Thank You
Royal Oak Grand Rapids
306 S Washington Ave 15 Ionia SW
Suite 212 Suite 270
Royal Oak, MI 48067 Grand Rapids, MI 49503
p: (248) 546-1800 p: (616) 776-1600
www.cdh.com
(c) C/D/H 2007. All rights reserved