Your SlideShare is downloading. ×

Mastering your SharePoint Internet Design

546

Published on

C/D/H shares expert advice for advanced-level SharePoint designers and developers. …

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.

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
546
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
15
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. Mastering your SharePoint Internet design
  • 2. Quick FactsAbout 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 PartnerCompetencies 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/HC/D/H Talks Tech C/D/H Tweets Tech
  • 6. Your PresenterJeff KinnellyConsultant, Design / DevelopmentJeffK@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 ApproachesPublic 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 LayoutMaster 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 Applicationsminimal.master • If you do not need site navigation, do not have a ribbon • If your app needs the space • For error pages or login pagessimple.master • Not customizable, but pages can be replaced • Show site using legacy interfacedefault.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 hivehttp://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. DemoBuilding a Brand Feature
  • 25. Upcoming SharePoint EventsSeptember 19: Business Intelligence inSharePointSeptember 26: West MichiganSharePoint User Group MeetingSeptember 29: SharePoint SaturdayOctober 17: SharePoint vNext
  • 26. Thank YouRoyal Oak Grand Rapids306 S Washington Ave 15 Ionia SWSuite 212 Suite 270Royal Oak, MI 48067 Grand Rapids, MI 49503p: (248) 546-1800 p: (616) 776-1600 www.cdh.com (c) C/D/H 2007. All rights reserved

×