I am following this SharePoint 2010 tutorial where the author is adding styles directly in the html mark-up of the page.

When I edit the mark-up in SharePoint 2013 and click OK initially the styles are applied, but when I click save and view the page again, all styles have been stripped out.

As Fox politely pointed out, this is normal behaviour - so how do I apply styles to html elements within SharePoint 2013 if I want to make a custom page with a custom layout?

  • 1
    What are you editing. Master Page, Page Layout? If you do edit content pages directly, SharePoint will strip out any HTML Elements such as <script> or <style> tags.
    – Fox
    Commented Mar 8, 2013 at 8:52
  • Ah that explains it then - I reworded my question to ask how to reference css files from templates. Thanks for the help so far.
    – morleyc
    Commented Mar 8, 2013 at 8:58

3 Answers 3


If you don't want to edit master pages or page layouts I usually store the CSS in a document library (or asset library) on the same SharePoint site. Then I add content editor web part (CEWP) to the page to 'insert' this css into the page.

Disadvantage is that you need to add that CEWP to every page where you want to apply the styling.

I have once written a blog post about it. Although the blog post is about inserting HTML snippet (google maps sample). The idea for your CSS is exactly the same. Store it in a file an reference it with a CEWP. (works great for JavaScript as well)

You find the post here: http://blog.amtopm.be/2011/05/04/use-google-maps-in-sharepoint-oob/

  • Thanks @W0ut, is it much more complicated to use a page layout or would we reference in the same way with the page template?
    – morleyc
    Commented Mar 8, 2013 at 19:22
  • Creating page layouts or a master has become a lot more easier in SP2013 by using the Design Manager (not in the Foundation version). Personally I prefer creating a page layout and insert the css (or a reference to the css) in the new page layout. However some clients do not allow me to create/use custom page layouts, SPD, etc... In such cases I found the above approach useful.
    – Wout
    Commented Mar 9, 2013 at 6:30

A very effective and easy way is to store the css files either in the file system or in the style library(I vote for the first one).

  1. First create a css file with the style definitions you want and save it in the structure in Visual Studio of a SharePoint Project. The files could either be copied to SharePoint root or to a SharePoint library on deployment.
  2. Then create a user control which you deploy to the controltemplates/projectname. In that user control you add the references to your css files add possible javascript files.
  3. Create a delegate control that puts your user control in the AdditionalPageHead on the master page.
  4. Create a feature for your delegate control that will activate your css.



I have not worked with Sharepoint 2013 before but i'm pretty sure that it stays exactly the same as in 2010. You can add

  • similar, but not exact.
    – 1c1cle
    Commented Jun 5, 2013 at 16:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.