Download presentation
Presentation is loading. Please wait.
1
http://MattHuber.com How to make SharePoint 2010 not look like SharePoint Branding for Developers By Matt Huber
2
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A About Me SharePoint guy @ Cardinal Solutions Love all things SharePoint –Branding is my favorite topic Video gamer
3
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Agenda Introduction Goals & Objectives What is Branding? Key Concepts Demo Q/A
4
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Goals & Objectives Learn what Branding is for SharePoint Show how Branding can enhance the SharePoint experience Get some ideas brewing for your brand Show how branding solutions are created
5
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A I have some questions… Who is using SP2010? Earlier? Is anyone using the default brand? Has anyone branded SharePoint before?
6
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A In a nutshell, branding is… Customization of the look & feel of SharePoint Making SharePoint not look like SharePoint Design Elements: Master Pages CSS Images Page Layouts Colors Fonts Taglines Animation etc…
7
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A History – SharePoint Team Services
8
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A History – WSS 2.0
9
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A History – WSS 3.0
10
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Now… – SharePoint 2010
11
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A
12
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A
13
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Concepts again… Design Elements: Master Pages CSS Images Page Layouts Colors Fonts Taglines Animation etc…
14
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A What is a Master.page? Acts as a container to each page. –Includes: Navigation, Search, Logos, Site actions controls and more
15
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Many, Many, Master.pages 5-6 different master.pages Publishing, Teams, MySite, Search, Meeting Workspace Each contain different controls and custom actions related to that Site Definition
16
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A What is a Page Layout? Contains zones for webparts and content.
17
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Page Layouts Most pages have a page layout Team & Publishing site templates behave differently Has multiple tags that put content into an associated on the master.page
18
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A What is CSS? Cascading Style Sheets – is a simple way to add fonts, colors, spacing and more to web pages.
19
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A CSS Multiple ways to apply CSS –External, inline, tag SharePoint has a lot of CSS… 75+ style sheets CSS 3 is available…but know your target browsers
20
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Browsers…. Plan for browser support link: http://technet.microsoft.com/en-us/library/cc263526.aspxhttp://technet.microsoft.com/en-us/library/cc263526.aspx
21
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Should we edit OOTB files?? Never! Don’t edit the existing CSS files, master.pages, images, or page layouts. We can create branding assets in a variety of ways while still being in a supported state
22
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A The implementation types Comes in a few forms: –Farm Solution –Sandbox Solution –Custom Branded solutions that accept themes –Themes –SharePoint Designer…
23
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A The Farm Solution Contains: –1 Farm Feature Applies branding to the farm (minus CA!) SPFeature.Add(“Site Collection Feature”) Also removes on deactivation –1 Site Collection Feature Applies branding to a site collection Sets SPWeb.CustomMasterURL, SPWeb. MasterUrl, & SPWeb.AlternateCSSUrl values
24
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A More on the Farm Solution Contains a lot more… –Multiple event receivers –Branding Assets (Master pages, page layouts) –Mapped Folders for _Layouts & _Images –Feature Stapling –Kitchen sink
25
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Lots of work… but for some good benefits! Automatic application of the proper master.page when the site definition is invoked Global on/off switch No modification of SharePoint files! Clean application, clean removal, we are on auto pilot now
26
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Tools IE Developer Toolbar or Firebug Multiple Browsers Notepad++ and a text comparison tool Fiddler SharePoint Designer PowerShell
27
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Demo
28
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Tips & Tricks Use Starter Master.Pages –Available on CodePlex Use CSS class ‘S4-NotDlg’ to exclude elements from the Modal Popup window Web Parts can have different styles…per Web Part Zone.
29
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A More Tips & Tricks Use those developer tools MSDN has some great resources.. Best starting point ever… –Bing: Real World Branding with SharePoint 2010 Publishing Sites
30
http://MattHuber.com Intro > Examples > Concepts > Demo > Q/A Contact Me Email – Huber.Matt@gmail.com Website – Matthuber.com Twitter – @Huber84
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.