Your SlideShare is downloading. ×
SPSVB 1 7-2012 - getting started with share point branding
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

SPSVB 1 7-2012 - getting started with share point branding

519
views

Published on

Published in: Technology

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
519
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
18
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Thomas Daly, tdaly@bandrsolutions.com Presented @ SPSVB 1/7/2012
  • 2. Thanks to the Sponsors!
  • 3. About Me SharePoint Consultant @ B&R Business Solutions, based out of NJ A SharePoint Developer – specializing in UI objects (webparts, user controls) both ASP.NET & jQuery components.; A SharePoint Brander – transform designs into css/images to skin SharePoint.
  • 4. What are we going to cover? What is Branding Planning What’s New in 2010 Tools & Supported Browsers Approaches to Branding Themes Master Pages Upgrading Demo
  • 5. What is SharePoint Branding? Creating a visual identity in SharePoint Covers everything, from editing pages, webparts, css, master pages, themes, page layouts, jquery/javascript, xslt, CAML, SharePoint Designer . . . Why brand SharePoint?  Create a unique look  Maintain company visual identity  Create distinct web areas  Make it not look like SharePoint
  • 6. Planning Intranet or Internet scenario Collaborational or Informational Determine Audience - target browsers, users, & screen resolution Existing company style or guidelines Custom Page Layouts Custom or 3rd Part Components Timeframe Approval Deployment
  • 7. What’s New – Changes Less Table, mainly DIV based New objects – Ribbon, Dialog Boxes Increased Browser Support Utilizing Office Theme Engine Increase Standards Compliance
  • 8. Tools & Supported Browsers Tools  IE Dev Toolbar (embedded in IE8)  Firebug / Firebug Lite  SharePoint Designer 2010  ColorPic  Multiple Versions  IE  Firefox  vmware workstation, virtual pc, or virtual box Supported Browsers  Internet Explorer 7 & 8  Mozilla Firefox 3.6  Safari 4.04
  • 9. Other Browsers & Tools Firebug Lite - Compatible with all major browsers: IE6+, Firefox, Opera, Safari and Chrome; Chrome  Built in developer tool bar Opera  Dragonfly
  • 10. No IE 6 Support 7 ways to tell your site visitors to upgrade
  • 11. Approaches to Branding Basic  End User situation – none or limited knowledge of html or CSS  Updating theme, adding logo, selecting new master page. Intermediate  Requires – some ability to understand, write CSS, html  Modifying current MasterPage, adding some custom CSS Advanced  Create Custom Master Page, custom CSS.
  • 12. Themes Set of graphics and cascading style sheets that control the look of your site. Uses Office themes (.THMX) 12 colors, 2 fonts
  • 13. Themes 3 Approaches to creating/updating the theme  Existing theme can be modified in UI (Publishing Features)  New theme can be created in PowerPoint and imported  Microsoft Theme Builder Tool http://connect.microsoft.com/themebuilder
  • 14. Theme Engine Attach Custom CSS – EnableCssTheming Enable custom CSS to see themes - /Style Library/en-us/Themable Capabilities – ref  Replace colors, Replace fonts  Recolor images - Blending, Tinting, Fill
  • 15. Custom Style Sheets Link to your custom CSS in the MasterPage Upload the CSS to the site, via Alternate CSS (Publishing Only)
  • 16. Master Pages Starter Master Pages – new term for Minimal Master Pages  http://startermasterpages.codeplex.com/  Includes 3 master pages: regular, foundations, meeting workspaces  Provides clean starting point for branding  Well documented for easy understanding V3 Master Page Support
  • 17. Search Master Page Contains Minimal Components Converting Custom Master Page into Search Center Master Page
  • 18. Ribbon Security Trim Ribbon Customize Ribbon Position Ribbon placement, look, behavior
  • 19. jQuery’s Role in Branding Creating interactive web components Manipulating the DOM after the fact Add / Remove classes Adjust CSS styles Perform adjustments to page base on other criteria Add flare
  • 20. Upgrading Branding Theme  No direct method Master Page  MSDN Article - Upgrading an Existing Master Page to the SharePoint Foundation Master Page http://msdn.microsoft.com/en-us/library/ee539981.aspx
  • 21. Deployment Options Varies depending on your branding effort SharePoint Designer Based  Upload master pages, images, CSS, & scripts  Manual process per site Solution Based Deployment  Upload master pages, images, CSS, & scripts  Automatically activate theme, apply master pages, build out site components.  Repeatable branding application, programmatically across sites
  • 22. Demo Theme  Create through PowerPoint, Import  Update through UI  Theme Tool Alternate CSS method Show V3 Master Page Support  OOTB v3.master  Heather base master page Show Starter Master  Apply Blank Master Page  Apply Customized Master Page Jquery  Conditional CSS  Enhance OOTB elements  DOM Changes Deployment  Feature driven deploymentweb
  • 23. Questions or Comments? Contact information  Thomas M Daly  Email - tdaly@bandrsolutions.com  Blog - http://thomasdaly.net  Twitter - _TomDaly_  Company Site – http://www.bandrsolutions.com

×