Look and feel of Lists

Question

How do you change the look and feel of Lists, so that they take on the color/styles of the Master Page? 

For example, my sites are all displayed in the BlackBand.master style, but my lists all show up as the default blue color!

Thanks

---

I hear and I forget. I see and I remember. I do and I understand.

Answer 1

You will have to go to schema.xml i.e. the definition of the list in layouts folder and see what modifications u can make

---

________________________________________ Gautham S Pai [MCAD]

Answer 2

How does it manifests?
Do you have custom view made in Sharepoint Designer or this is happening in AllItems.aspx page of your list?
Does only list show in blue and the rest of the page (navigation, menu, quick lunch) is black, or whole page is in default blue style?

If it affects whole page, maybe you should pen it in Sharepoint designer and check what master page does it relies on.
If this is custom page made in Sharepoint designer you should open it in back in Sharepoint designer and check attached stylesheets.

Answer 3

The whole page is in black/grey, with only the lists displaying in the blue color. 

Where do I look in SharePoint Designer to change it?

Thanks

---

I hear and I forget. I see and I remember. I do and I understand.

Answer 4

Hi all,

You can make changes to the look and feel of any list in one of the following ways:

1) Change the schema.xml file to modify an existing view of the list or add a view to the list, this will give you the view every time you create the list. The schema.xml file is located on the server in which sharepoint is installed on. Be careful however, you can also make an error in this file which will cause every page that has that list on it fail.

2) Add a .aspx page to the list folder, this will be a one time page for the list and you can customize the surronding elements for the list.

3) Change the theme (ie colors, etc) to change the lists look.

Answer 5

BlueScreenOfDeath said:

2) Add a .aspx page to the list folder, this will be a one time page for the list and you can customize the surronding elements for the list.

How do you do this???  Create a new, blank .aspx file in SharePoint Designer?

---

I hear and I forget. I see and I remember. I do and I understand.

Answer 6

Yes, then you can add a sharepoint list view (new, edit, view) which will render the actual list. But you can add surronding elements, such as headers, pictures, text, etc. to the aspx page.


This should help:

http://office.microsoft.com/en-us/sharepointdesigner/HA101191111033.aspx

Answer 7

I think you should ignore advise changing schema.xml, because that's the wrong way. Everything you need for look and feel of your list can be set using css. For example New, Actions and Setting menu of you list is using ms-menutoolbar and ms-toolbar classes. It should take class definitions from theme css file which is defined in master page. 
In your case something went wrong. It looks like either someone has played with schema.xml or someone edited this page in sharepoint designer and customized css.
All in all it shouldn't behave as it behaves in your case.

Answer 8

But that will change will the look and feel of all lists..!!

What if i want to maintain a different look and feel for each list..!! 

Answer 9

Sharepoint Designer DataView web part. Here you can edit xslt and change css styles of your lists without touching the schema.xml file

Answer 10

So to change the look and feel for ALL LISTS, you can just change the css style in SD?  Where at?  Is it still necessary to create a new aspx page? 

---

I hear and I forget. I see and I remember. I do and I understand.

Answer 11

Drasko.Popovic said:

I think you should ignore advise changing schema.xml, because that's the wrong way. Everything you need for look and feel of your list can be set using css. 

This is not entirely true. For instance, if you'd like to change the way that a list is structured you will need to modify the schema.xml because Sharepoint uses tables for structuring. If you'd like different views for lists that will be applied everytime you build that list, you'd want to do this in the schema.xml. If you'd like the functionality to change, (ie: adding in jQuery or Javascript functionality) you can add this to the schema.xml that will applied to all your lists. Always ensure that you properly backup your files and you can accomplish a lot of customization that is not offered by simply editing css styles.

Yes it is true that css can do most of what your looking for but customization can go a lot deeper than css. Again it all depends on what your trying to accomplish.

To change the css, you can override the css in the core.css (Again on the server) or add the same css class names with different styles in your own aspx page (or in a CEWP on the same page).

Here's a link to help you out. http://www.heathersolomon.com/content/sp07cssreference.htm

Answer 12

I have to agree with BlueScreenOfDeath.
For certain functionality you have to change schema.xml, but I prefer to create Custom List in Visual Studio  (List Definition solution) and then play with schema.xml. My recomendation was not to play with schema.xml of out of the box lists. If you create your own (from scratch or based on existing one) ok.
Let's go back to layout. For layout I think is much easier to use sharepoint designer. With dataview web part you can change how your list will be displayed so you can create your on views with custom html. I think it's easier then changing schema.xml, and much safer. When You are happy you can save your list as template and  get reusable list template (this is workaround for BlueScreenOfDeath advice - "For instance, if you'd like to change the way that a list is structured you will need to modify the schema.xml because Sharepoint uses tables for structuring. If you'd like different views for lists that will be applied everytime you build that list")
If you want to change only visual aspect (colors, fonts, background images) then css is enough. You can open Sharepoint designer, then in _themes folder of your site you find your theme folder and then open theme.css file. Here you can change colors and stuff.
For instance:

1	.ms-toolbar-togglebutton-on {<BR>&nbsp;&nbsp;&nbsp; border:1 solid
2	#1c418c;<BR>&nbsp;&nbsp;&nbsp; background-color:
3	#fffacc;<BR>}<BR>table.ms-toolbar, table.ms-viewtoolbar {<BR>&nbsp;&nbsp;
4	background-image: url("toolgrad_simple.gif");<BR>&nbsp;&nbsp;
5	background-color:#dde4f4;<BR>}<BR>table.ms-toolbar {<BR>&nbsp;&nbsp; border: 1px
6	solid #bad6dd;<BR>}<BR>table.ms-viewtoolbar {<BR>&nbsp;&nbsp;
7	border-top:none;<BR>&nbsp;&nbsp; border-bottom:none;<BR>}<BR>.ms-listheader
8	{<BR>&nbsp;&nbsp; color: #4f79cc;<BR>&nbsp;&nbsp; background-color:
9	#a9cbd3;<BR>}<BR>.ms-menutoolbar {<BR>&nbsp;&nbsp; border:solid 1px
10	#BADBE8;<BR>&nbsp;&nbsp; border-bottom:solid 1px #839aa3;<BR>&nbsp;&nbsp;
11	background-color:#DDE4F4;<BR>&nbsp;&nbsp; background-image:
12	url("listheadergrad_simple.gif");<BR>}<BR>.ms-menutoolbar
13	td{<BR>border-top:solid 1px #fff;<BR>border-bottom:solid 1px
14	#eaf3ff;<BR>}<BR>.ms-menutoolbar td a {<BR>&nbsp;&nbsp; color:
15	#002672;<BR>}<BR>.ms-listheaderlabel {<BR>&nbsp;&nbsp; color: #000;<BR>}

these are some css styles for formatting list headers and menus. You just change them and that's it.

Answer 13

So I opened SharePoint Designer, and the _themes folder - there isn't a folder in there named theme.css, only themes.inf

Do I have to create a new folder named theme.css?

Thanks!

---

I hear and I forget. I see and I remember. I do and I understand.