A quick run down on the steps to add a Cascading StyleSheet to a SharePoint Application page in Visual Studio 2010
From the Visual Studio 2010 Solution Explorer, select the project, right click and select the Add option and then the “SharePoint Mapped Folder…”
The “Add SharePoint Mapped Folder” dialog is presented which displays all the folders under {SharePointRoot}:
Select the location that you would like to place your Stylesheet, which in most cases will be: {ProgramFiles}\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\1033\STYLES
Once the STYLES folder is added, it may be easier to add a custom folder that will contain your CSS file(s)
Now that the folder structure is complete, you can add a stylesheet to that folder:
Inside your application page, reference the stylesheet within the PlaceHolderAdditionalPageHead ContentPlaceHolder similar to: <link type="text/css" rel="stylesheet" href="/_layouts/1033/styles/Sohema/sohema.css" />
The details of adding the files to the package is nicely handled by Visual Studio and included in the Package xml files:
Deploy your solution and notice the addition of your CSS file under the location that was specified:
Add content to your CSS file and you’re done!
#1 by Tyrin-J Osimen on January 7, 2011 - 2:02 pm
Great article; short and to the issue of the day. I just want to point out that the code segment you provided ” ” should actually be this ” “. Note the inclussion of two periods (.) before the first forward slash and the absence of “_layouts”; otherwise the css file would not be recognized by the underlying platform.
#2 by Ted Hagler on April 23, 2012 - 1:27 pm
Hey thanks for the article. I’ve been searching for this solution for about a week. Very simple to follow without a bunch of ridiculous coder jargon so many others use. *KUDOS*