How to deploy a style sheet into content library using Visual Studio 2010 Beta 2

How to deploy a style sheet into content library using Visual Studio 2010 Beta 2

  • Comments 1

If you do not want to inherit the look and feel of the out of the box SharePoint application and content pages, you can change it using Cascading Style Sheets (CSS). Style sheets can either be deployed to the Layouts folder or Styles library using Visual Studio 2010.  Files deployed to the Layouts folder reside on the machine’s file system and the files deployed to the Styles Library reside in the content database. You can find more information on the pros and cons of deploying files to the Layouts vs. Styles Library in the following MSDN article, Implementing a Brand in a SharePoint Server 2007 Publishing Site. You can also deploy a style sheet to the Layouts folder using a mapped folder, which is not shown here.

In order to deploy a style sheet to the content database you will need to follow these steps:

1. Create an VS 2010 Empty SharePoint project

2. Add a new “Module”  Item named “Styles” to the project

3. Delete the sample.txt

4. Right click on the “Styles” folder and add a .css file(found under web node in the Add New Item dialog) and name it “newstyle.css”, while adding the style tags that you would like to define.

5. In the elements.xml file, specify the Url of the Module as “Styles Library” and set the file Type as “GhostableInLibrary”

<Module Name="Styles" Url="style Library">
<File Path="Styles\newstyle.css" Url="newstyle.css" Type="GhostableInLibrary"/>
6. Right click on the project and choose deploy. 

7. The stylesheet should now be deployed to the style library which you can view by going to http://<MachineName>/Style%20Library/Forms/AllItems.aspx

You can reference the file like any other css file using the path http://<MachineName>/Style%20Library/newstyle.css.

Pallavi Vajranabhaiah

Leave a Comment
  • Please add 7 and 2 and type the answer here:
  • Post
  • Hi,

    If style library contains the folders and i want to deploy the image in respective folder how can i achieve this using Module. any idea??

Page 1 of 1 (1 items)