themes & composed looks in sharepoint 2013 & o365
TRANSCRIPT
Accessible content is available upon request.
Themes & Composed Looks for SP2013 and O365D’arce Hess
SPSNYC 2015
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Text/Icon/Pic
Text/Icon/Pic
Text/Pic
@darcehess
https://www.linkedin.com/in/darcehess
D’arce HessStrategic Consultant
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Agenda
Questions
Introduction
Components
Tools
Deployment
References
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
INTRODUCTION
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Composed Looks
Change the theme by going to Site Settings
Change the Look
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
OOTB Composed Looks
18 Provided OOTBCan be modified, but Best Practice to make a copy
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Background Image
Color Palette
FontMaster Page
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
COMPONENTS
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Parts of a Composed Look
MasterPage CSS Color
Palette Font
Background
Image
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Master Pages
The Seattle Master Page contains a left navigation
The Olso Master Page does not contain a left navigation
Seattle.master
Olso.master
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Custom CSS (Alternate CSS)Adjust any custom CSS to allow for theming using .spcolor naming convention. Microsoft Reference:
https://msdn.microsoft.com/en-us/library/office/jj945889.aspx
For Custom CSS to be themable, file must be stored in “Themable” folder in the Style Library
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Custom CSS (Alternate CSS)
Apply Alternate CSS through Master Page settings.
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Color Palette
XML file that SharePoint reads to apply HEX colors to various items in SharePoint
/sites/yoursite/_catalogs/theme/15/palette015.spcolorWhere it is located:
Microsoft Reference:https://msdn.microsoft.com/en-us/library/office/jj945889.aspx
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Font
/sites/yoursite/_catalogs/theme/15/fontscheme001.spfontWhere it is located:
XML file that SharePoint reads to apply font changes to various items in SharePoint.
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Background Image
Following formats are accepted:• .jpg• .bmp• .png• .gif
File size restriction on the image is 150KB, so be sure to optimize your img ahead of time.
Save img in Site Assets
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
TOOLS
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
SharePoint Color Palette Tool
Download:
CLICK HERE
Allows for easy creation of a color palette and produces sp.color file
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
DEMO
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
DEPLOYMENT
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Create .spcolor file
Create .spfont file
Choose Master Page
Gather Background
Img
Load Custom CSS file
Create Composed
Look
Composed Looks
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Navigate to /yoursite/_catalogs/design/AllItems.aspx
New Item
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Fill out the required fields and press “Save” button when finished.
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Navigate to Site Settings and choose “Change the Look”
Choose your custom Composed Look
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Choose “try it out” to load a preview file
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
If you like the preview, choose “Yes, keep it”.
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Voila!Your theme has been applied.
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
DEMO
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
Powershell
Manual Deployme
nt
“Add-in”Model/CSOM
Third-PartySolution
Multiple Site Collection Deployment
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
REFERENCES
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
SharePoint Color Palette Tool https://www.microsoft.com/en-us/download/details.aspx?id=38182
Scott Hiller’s Provisioning Documentation https://github.com/ScotHillier/SPSBoston2015
Microsoft spcolor file reference https://msdn.microsoft.com/en-us/library/office/jj945889.aspx
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.
QUESTION & ANSWER
©AvePoint, Inc. All rights reserved. Confidential and proprietary information of AvePoint, Inc. No part of this may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written consent of
AvePoint, Inc.