Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

SharePoint 2010: Problems with custom themable css

Posted on 2011-03-17
7
Medium Priority
?
1,658 Views
Last Modified: 2012-05-11
I am trying to create a custom themable CSS file and it doesnt seem to be working. Here is where I got so far:

I created a customstyle.css in the root of my site collection: /Style Library/Themable/customstyle.css
I added the sample style definitions in the following format: body{ /* [ReplaceColor(themeColor:"Dark2-Darker")] */ color:#676767; /* [ReplaceColor(themeColor:"Accent2")] */ background-color:#fff; }
On a subsite in that site collection I created a custom master page and attached that css file in the following format:
<SharePoint:CssRegistration name="<% $SPUrl:~sitecollection/Style Library/Themable/customstyle.css %>" After="corev4.css" runat="server"/>
When I check the source of that site after refresh I see the following:
<link rel="stylesheet" type="text/css" href="/_layouts/1033/styles/portal.css?rev=0gSit0FmDdWuMu7kF0JZ9g%3D%3D"/> <link rel="stylesheet" type="text/css" href="/sites/projects/_catalogs/theme/Themed/67B9FADD/search-7E1AFF02.css?ctag=4"/> <link rel="stylesheet" type="text/css" href="/sites/projects/_catalogs/theme/Themed/67B9FADD/corev4-8A0ABD2F.css?ctag=4"/> <link rel="stylesheet" type="text/css" href="/sites/projects/_catalogs/theme/Themed/67B9FADD/customstyle-75F18201.css?ctag=4"/>
From the above I see the reference to the customstyle.css but I am not sure if it is a correct format and there are no changes on the site.

What am I doing wrong or what is missing here?

One more thing: I don't have publishing features enabled on this site collection. Does it matter?

Thanks!
0
Comment
Question by:MisUszatek
  • 4
  • 3
7 Comments
 
LVL 51

Expert Comment

by:Ted Bouskill
ID: 35166254
Everything appears to be correct, however, you didn't applying the master page or are you changing the default one?

Publishing shouldn't matter.

Use the IE Developer Toolbar (installed by default in IE8+) to analyze the CSS inheritance.
0
 

Author Comment

by:MisUszatek
ID: 35167745
I found another issue. When I try to go to this location:
/sites/projects/_catalogs/theme/Themed/67B9FADD/customstyle-75F18201.css
where that custom css is referenced I get 404 Not Found message.

It works for other css files, for example:
/sites/projects/_catalogs/theme/Themed/67B9FADD/corev4-8A0ABD2F.css

Any idea how to fix it?

And yes I am using a custom master.
0
 
LVL 51

Expert Comment

by:Ted Bouskill
ID: 35170150
Hmm, I wonder if the problem is the fact that you are trying to use a themed link.

As it happens just today I was working on a custom master page but I did it like this:
<SharePoint:CssRegistration name="<% $SPUrl:~sitecollection/Style Library/override_corev4.css %>" After="corev4.css" runat="server"/>

It works perfectly.

As far as I know if you want to use themed CSS you have to deploy them to these LAYOUTs folder
c:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\LAYOUTS\1033\styles\
c:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\LAYOUTS\1033\styles\Themable\

For example corev4.css is located in both those folders.

Try my technique and see if that works.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 

Author Comment

by:MisUszatek
ID: 35170221
Do you use ReplaceColor in your override_corev4.css? I was able to make it work with regular css in that location but not with themable. I will try to experiment with Layouts folder.
0
 
LVL 51

Accepted Solution

by:
Ted Bouskill earned 1000 total points
ID: 35170348
I've copied some properties from the corev4.css and left that tag in it, but of course it doesn't change the color unless I move them to the LAYOUTS folder.  So, I'm going to write a custom feature to deploy my custom master page and special CSS files to the LAYOUTS folder.  I don't like manually deploying anything because the changes can disappear when I upgrade and will not automatically deploy to new servers.
0
 

Author Closing Comment

by:MisUszatek
ID: 35337526
I was not able to test it yet and EE is forcing me to close this question. Thanks for helping!
0
 
LVL 51

Expert Comment

by:Ted Bouskill
ID: 35337720
As it happens I implemented the feature yesterday and the theming worked perfectly as I described.
0

Featured Post

How to Use the Help Bell

Need to boost the visibility of your question for solutions? Use the Experts Exchange Help Bell to confirm priority levels and contact subject-matter experts for question attention.  Check out this how-to article for more information.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

If you create your solutions on SharePoint sooner or later you will come upon a request to set  permissions of the item depending on some of the item's meta-data - the author, people assigned as approvers, divisions, categories etc. The most natu…
A recent project that involved parsing Tableau Desktop and Server log files to extract reusable user queries for use in other systems. I chose to use PowerShell to gather the data, and SharePoint to present it...
This lesson discusses how to use a Mainform + Subforms in Microsoft Access to find and enter data for payments on orders. The sample data comes from a custom shop that builds and sells movable storage structures that are delivered to your property. …
Loops Section Overview
Suggested Courses

971 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question