What is sitewide styling?
Every Drupal site receives sitewide styling instructions from its theme's CSS files. Sitewide styling may include rules to set:
- Layout (positioning and sizes for headers, columns, footers, and blocks)
- Text formatting (fonts, colors, sizes, line-height, margins)
- Backgrounds (colors, images, gradients)
Sitewide styling vs. one-time overrides
| Sitewide Styling | One-Time Overrides | |
|---|---|---|
| Purpose | Added to style new features/blocks | Added to style an element appearing on one page only |
| Where | Stored in theme CSS files (external stylesheets) | Stored in a single page's HTML code within any field that uses a text format of Full HTML with CKEditor or Full HTML (inline styling) |
| Scope | Rules will apply to any part of the site that matches the rule's selection criteria | Rule will apply only to the element where the rule is defined |
| Who does it | Changes are made by an administrator | Changes are made by anyone with access to the page's HTML Source code |
| Helpful to know | HTML, CSS, Drupal theme basics | Basic HTML tags and CSS declarations |
I want a sitewide style change (in an external stylesheet)
If someone at your library serves as a local administrator for your library's website, contact him/her about the change.
If SCLS staff manage your site's theme, contact the SCLS Help Desk.
I want to make a style change for just one page (using inline styling)
Inline style changes may be made in HTML source code of any field that uses a text format of Full HTML with CKEditor or Full HTML (inline styling).
- View the field's HTML source code.
- Locate the HTML tag you want to modify with CSS styling.
Example: <p> - Add a style attribute to the HTML tag.
Example: <p style=""> - Add CSS declarations within the style attribute.
Example: <p style="color: red;">
Learning More about HTML and CSS
There are many sources for HTML and CSS training. Some tutorial sites: