Project Description
This is a fully commented CSS override that allows to customize the default look and feel of most areas of an existing SharePoint site with just a few changes.

Objective
The main goal of this project is to create a lightweight, 100% CSS-based theme that can be used to easily identify and change branding properties (link color, background color, list colors, etc, etc. etc.) of a site, without causing any impact to the html structure.
CSS properties are grouped in order to allow changing all elements of a specific color set in a single area.



Installing
You can grab the CSS from the project (theme folder) and use it on top of your existing setup, or use the full WSP with the activate/deactivate functionality.
Supports both Foundation and Server.

Provisioning details
- This is a solution specific for SharePoint 2010 websites
- This solution uses minimal security permissions, and is by default shipped as a sandboxed solution, as the solution deployment scope (others: GlobalAssemblyCache, WebApplication). The solution can then be uploaded independently to necessary site collections through the "Solutions Gallery". Remote access to the server is not required.
- The solution has a single web-scoped feature (others: Farm, Web Application, Site). This means that ALL web sites on the site collection will have a feature option on site settings that allows the feature to be enabled there, whether or not it is enabled on other web sites.
- Upon feature activation, the current site will provision it's OWN set of resources, independent from other websites (master pages, css, images, javascript, etc.).
- Upon feature activation, on the ROOT SITE of the site collection, all subsites will automatically be defined to use the same master page and main css file from the root site, enabling inheritance throughout the site collection. This can be disabled after activation, or completely by commenting the code that navigates into subsites.
- Upon feature deactivation, all resources (previously shipped by the solution) will be erased from the current site. Master pages and css will fallback to avoid the site from crashing from lack of linked files.
- Upon feature deactivation, on the ROOT SITE, on top of the above, the feature will also navigate through all subsites and default their master pages and css accordingly to make sure none of them miss their master page after deletion.
- All resources included are checked in and approved to make sure they are available for usage for all users, including anonymous (if applicable). They are also checked in and approved before deletion to make sure no errors occur during deactivation, due to check out files.

Look and Feel details
There are many ways to implement css files and resources.
MOSS had a nice theme platform, while SP2010 uses XML themes, which don't support full customization.
After many different approaches tried, the following will describe the current procedure.
- A List is created on the site which the feature was activated
- All resources (css, images, javascript, etc.) will be placed inside the list and will be checked in and approved automatically
- All master pages (and their variants) are placed in _catalogs\masterpages
- The master page required for the current site template (team, search, meeting) will be applied accordingly as necessary (both system and site master)
- A main css file will be referenced in the master page of the current site
- Secondary css files will be included through css @import on the main css file
- SharePoint:ProjectProperty "Url" and "SiteUrl" are used to reference css and javascript files in master pages (as opposed to SPUrl:~SiteCollection or SPUrl:~Site) in order to work on Foundation as well as Server versions)
- SiteUrl will be used for the root site, to enable inheritance, and Url will be used on subsites to enable site-by-site usage.
- All scripts will be included locally, as opposed to using CDN links, since most SharePoint infrastructures don't allow Internet access, and also to prevent code from stop working due to plugin updates. Also, I recommend that needed scripts are added on pages they are used on, and not on the master page generically, to avoid unecessary overhead.
- All typography (aka "fonts") are inherited back to the "body" tag. This means the whole site will use the same font.
- All border colors are set back to "transparent" to hide the "blueish" coloring and also to prevent pixel issues if specific border sizes are used (e.g. 0px).
- Most common customization properties are placed in the main css file, grouped and extendly commented to improve visibility and changes (e.g. link color, menu link color, menu link color hover, menu background color, text color, context menus styles, etc)
- None of the default structure of SharePoint master pages was changed during the course of this solution. The idea is for that to be a decision of the developer. V4.master was used and only a couple of things were added on top of it (repositioned "Sign In" link, hidden ribbon for anonymous users, added css and javascript references)

Last edited Jan 23, 2015 at 7:12 PM by ftlcd, version 17