Aldrich: Custom CSS pattern

This pattern is used for referencing custom CSS files.

custom css data definition in its default state

How this works

Include custom CSS

Selection

What this means

What this triggers

Selection

What this means

What this triggers

Yes

Indicates that custom CSS will be used.

Causes the CSS reference Data Definition group to be displayed.

No

Indicates that custom CSS will not be used.

N/A

CSS reference

Only displayed when Include custom CSS is set to ‘Yes’.

css reference data definition group

This group contains all the fields necessary for defining a reference to a single CSS file.

You can add as many CSS references as you need.

→ Detail: Proliferating Data Definition items

Type

type data definition field

Selection

What this means

What this triggers

Selection

What this means

What this triggers

Asset

Indicates the CSS file is located in Cascade as a part of your site.

Causes the File Data Definition field to display.

URL

Indicates the CSS file exists somewhere on the web (not part of your site).

Causes the URL, Crossorigin handling, and Integrity Data Definition fields to display.

File

Only displayed when Type is set to ‘Asset’.

file data definition field

Use the asset chooser to select the desired CSS file in your Cascade site.

URL, Crossorigin handling, and Integrity

Only displayed when Type is set to ‘URL’.

url, crossorigin handling, and integrity data definition fields

Enter the full URL of the CSS file in the URL text field. Some websites also provide integrity and crossorigin attribute values with their hosted files.

<link .... crossorgin=”....” integrity=”....” />

Use the Crossorigin handling and Integrity fields to provide the respective values.