Skip to main content

Cloud

Clean Up Customized CSS Files with CSSCompare

Have you ever come across a SharePoint installation that’s been customized in an unsupported way? You look at the 12 (or 14) hive and see that files have been modified by hand? Not good.
 
As you may know, changing core SharePoint files is unsupported and can lead to problems when patching.
 
The best way to clean up modified SharePoint installations is to pull out the customizations and move them into new files as part of a solution package (WSP file). That makes it easy to re-deploy customizations and ensures your environment will stay clean.
 
Re-packaging most files is easy, but CSS can be very tricky to pull out the customizations. What if somebody went in and modified a few random styles (e.g. changing a color attribute or border width). Tracking those down by hand is tedious and error-prone.
 
 
For situations like these, I wrote a tool called CSSCompare which is hosted on CodePlex. CSSCompare will look at two CSS files and output the effective differences between them.
 
With SharePoint, you can take your customized version of Core.css (or other customized CSS file) and find the differential from an uncustomized version of Core.css by running:
 
CSSCompare.css -v1 CustomizedCore.css -v2 OriginalCore.css > MyCustomStyles.css
 
You can then add “MyCustomStyles.css” to your solution and replace your customized file with its original version.
 
Other Uses
 
CSSCompare works with any CSS files, so it can be used in non-SharePoint scenarios as well. I’ve started using it in version control situations to quickly determine changes between styles.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Bert Johnson

More from this Author

Follow Us
TwitterLinkedinFacebookYoutubeInstagram