共用方式為

Working with the Monitoring CSS Files to Adjust Settings in Deployed Dashboards

  • 發行項

PerformancePoint Monitoring server has a few style sheets that can be adjusted in order to modify settings in your deployed dashboards. For example, when exporting a dashboard using the standard CSS file settings you will see a screen similar to the one below:

css1

However, you may want to set the dashboard and page list, filter name and tree, and report titles to be larger. By adjusting settings in the Monitoring style sheets you can get to a dashboard that looks like:

css2

Notice the enlarged font for the dashboard page listing, the parameters and the views. There are many settings in the CSS files that can be adjusted to make minor presentation changes. These are outlined below. Note that there are two different CSS file locations - one for dashboard deployed to SharePoint and one for dashboard deployed to Preview.

For SharePoint the location is: C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\wpresources\Microsoft.PerformancePoint.Scorecards.WebParts\<version number>

For Preview there are two file locations. First is the location that will affect the appearance of your dashboard deployed to the preview site: C:\Program Files\Microsoft Office PerformancePoint Server\3.0\Monitoring\PPSMonitoring_1\Preview\res

Second, is the location that will affect the appearance of things in the dashboard designer: C:\Program Files\Microsoft Office PerformancePoint Server\3.0\Monitoring\PPSMonitoring_1\WebService\Preview

The following two CSS files have a variety of class attributes that can be set. Some sample classes and attributes are identified below - other classes and attributes are also available in the files.

ppsDashboard.css file

To adjust the filter name font, change the font-size value on the .pps-parameterTitle class.

To adjust the filter display values font, add a .pps-tree-label-text class and set a font-size attribute - such as:

.pps-tree-label-text

{

Font-size: 14pt;

}

To adjust the report title font size, change the .pps-picker and .pps-pickerSelectedItem class font-size settings.

To adjust the dashboard name and page list font size, change the .ppsma-pageOverviewList and .ppsma-PageOverviewTitle class font-size settings.

ParameterTree.css file (NOTE: this file does not exist in the . PPSMonitoring_1\WebService\Preview location)

To adjust the tree view filter width of the filter, adjust the .pps-tree-label class width from 375px to your selected width.

 

Alyson Powell Erwin (alysonp@microsoft.com)

Comments

  • Anonymous
    December 18, 2007
    Interesting point at blogs.msdn.com

  • Anonymous
    January 09, 2008
    Thank you for taking the time to write this!  This is awesome.  I've always hated how wide the parameters were.  Now I can fit several across the top of a dashboard. Cheers! John Workman

  • Anonymous
    March 06, 2008
    AS you said: [i]The following two CSS files have a variety of class attributes that can be set. Some sample classes and attributes are identified below - other classes and attributes are also available in the files. [/i] Can i get the details of all the classes and attributes and what for they are used?

  • Anonymous
    May 24, 2012
    Has this changed in sharepoint 2010?  I can't seem to get it to work at all, and I know I did it about 1 year ago.

  • Anonymous
    August 09, 2012
    ParameterTree.css file I have created a dashboard page in which horizontal scroll bar appears. I remove the scroll bar by changing the width from 275px to 165px in .pps-tree-label class in  ParameterTree.css If i check the page on Development sharepoint server then horizontal scroll bar is not visible but if i check the same page outside the server i can see the scroll bar. Even the screen resolution is same Any suggestions........