General content patterns

General content patterns exemplify how general content and/or most pages within a website can be structured through the use of different resets, utilities, and components within different page layout areas.

Basic

The basic general content pattern is an example of a standard inner page of a website, with a main article with a card in the sidebar to highlight a key portion of the content.

Announcement & blockquote

Extending the basic general content pattern, the announcement/blockquote variant begins introducing more elements, such as lists and blockquotes to further organize the page's content.

Hero & accordion

The hero/accordion general content pattern further organizes the content by adding a feature hero component at the top of the page, removing the card component from the sidebar, and compartmentalizes the main article by putting some sections in an accordion component.

Vertical cards

The vertical cards general content pattern takes a more simplified approach to the hero/accordion variant's organization by ditching the feature hero component, adding back in a less prominant card to the sidebar, and compartmentalize the main article by putting some sections into different card components with images.

T4 implementation

General content is implemented in T4 as the "General Content" plugin. All WYSIWYG content created within this plugin is wrapped by a <div> element with a .plugin-general-content class and an ID that allows for internal content linking. It has know direct styles, but inherits its styles from the page layout CSS.

Areas

The "General Content" plugin can moved to different areas on the page using the area:{$} injector in the "Injectors" field, where $ is one of the following keywords:

• feature - Moves the general content to the feature area of the page (below the main navigation, above the sidebars and main content).
• sidebar - Moves the general content to the sidebar area of the page (right of the main content).
• footer - Moves the general content to the footer area of the page (above the footer, below the sidebars and main content).

This plugin can also be used within the global "Site-Feature", "Site-Sidebar", and "Site-Footer" sections to have it displayed globally within the feature, sidebar, and footer areas respectively.

Injectors

In the "Injectors" field of the "General Content" plugin, the following injectors can be used:

• area:{feature|sidebar|footer} - Changes the area on the page the general content is displayed.
• id:{custom_id} - Overrides the default, T4 ID of the general content wrapper with a custom ID.
• class:{custom_classes} - Adds custom classes to the general content wrapper.
• style:{custom_styles} - Adds custom styles to a style attribute of the general content wrapper.
• before:{custom_html} - Adds custom HTML before the general content.
• after:{custom_html} - Adds custom HTML after the general content.