Linking to an External Cascading Style Sheet

In this section:

To format a report using an external cascading style sheet (CSS), you must link the cascading style sheet to the report in one of the following ways:

Using the CSSURL Attribute and Parameter

How to:

You can link an external cascading style sheet (CSS) to a report using the CSSURL WebFOCUS StyleSheet attribute or the CSSURL SET parameter. To choose between them, consider the advantages of:

If you specify CSSURL in several ways, the specification with the most local scope takes precedence. The order of precedence, from highest (1) to lowest (3), is:

For more information about the CSS attribute, see Use the CSSURL Attribute to Link to an External CSS. For more information about the CSS parameter, see Use the CSSURL Parameter to Link to an External CSS.

Syntax: How to Use the CSSURL Attribute to Link to an External CSS

To link an external cascading style sheet (CSS) to report using a WebFOCUS StyleSheet attribute, use the following syntax

[TYPE=REPORT,] CSSURL={url|ibfs}, $

where:

TYPE=REPORT

Specifies that this attribute is being applied to the entire report. If it is omitted, the StyleSheet declaration defaults to it.

url

Is the URL of the external cascading style sheet. If the external CSS resides on a web server platform that is case-sensitive, you must specify it using the correct case.

The URL can be up to 255 characters. If your external cascading style sheet URL exceeds this limit, you can shorten the URL by defining an alias (also known as a virtual directory) on the web server to represent part of the path.

You can specify an absolute or relative URL. If it is relative, the external CSS must reside on the web server used by WebFOCUS.

ibfs

Is a path that points to a WebFOCUS repository that contains the external cascading style sheet file. This path is internally converted to a web-accessible URL that points to the location of the .css file.

Example: Linking to an External Cascading Style Sheet Using the CSSURL Attribute

This report displays the products currently offered by Gotham Grinds. It is formatted using an external cascading style sheet (CSS), and links to the CSS using the CSSURL attribute in the WebFOCUS StyleSheet:

TABLE FILE GGPRODS
HEADING
"</1 Current Products</1"
PRINT PRODUCT_DESCRIPTION UNIT_PRICE
BY PRODUCT_ID
ON TABLE SET PAGE-NUM OFF
ON TABLE SET ONLINE-FMT HTML
ON TABLE SET STYLESHEET * 
TYPE=REPORT, CSSURL=http://websrv2/css/report01.css, $ 
TYPE=HEADING, CLASS=headText, $
TYPE=TITLE, CLASS=reportTitles, $
TYPE=DATA, CLASS=lowCost, WHEN=N3 LT 27, $
ENDSTYLE
 
END

The request produces this report:

Note: To specify a path that points to a WebFOCUS repository that contains the report01.css file, use the following syntax for the CSSURL parameter on the TYPE=REPORT line in the request:

TYPE=REPORT, CSSURL=IBFS:/WFC/Repository/css/report01.css, $

Where css is the folder in the WebFOCUS repository where the report01.css file resides.

Syntax: How to Use the CSSURL Parameter to Link to an External CSS

To link an external cascading style sheet (CSS) to a report using a SET parameter, issue the following SET command in a procedure

SET CSSURL = css_url

or the following ON TABLE SET command in a report request

ON TABLE SET CSSURL css_url

where:

css_url

Is the URL of the external cascading style sheet. If the external CSS resides on a web server platform that is case-sensitive, you must specify it using the correct case.

The URL can be up to:

  • 69 characters long in a SET command.
  • 57 characters long in an ON TABLE SET command.

If your external cascading style sheet URL exceeds this limit, you can shorten the URL by defining an alias (also known as a virtual directory) on the web server to represent part of the path.

You can specify an absolute or relative URL. If it is relative, the external CSS must reside on the web server used by WebFOCUS.

For an example, see Linking to the ReportStyles External Cascading Style Sheet.

If you specify CSSURL multiple times, the last value specified using ON TABLE SET overrides all the other values within that report request. If CSSURL is not specified within a report request, the last value specified using SET overrides all the others.

For general information about using SET commands, see Customizing Your Environment in the TIBCO WebFOCUS® Developing Reporting Applications manual.