NU Global Elements - kernl(ui) - WordPress Plugin

Introduction

A WordPress plugin developed by the Northeastern University ITS Web Solutions team. Loads the latest version of kernl(ui) Global Elements to your website, including the code for the TrustArc cookie consent manager.

The global elements package includes elements that should be included on almost all Northeastern sites. They contain dynamic content and fixed designs for consistency across sites. TrustArc allows users to set their cookie preferences and is required on all Northeastern University websites.

Learn more about the kernl(ui) design system.

Requirements

• Global Header. In order for the global header to display, the active theme must support a call to wp_body_open() after the opening <body> tag:

    <body class="nu__body-class">
        <?php wp_body_open(); ?>
  
        ...

• Conflicts. If older versions of the NU Global Elements are active on the site, changes to theme files or plugin settings may be needed to prevent old and new global elements from displaying at the same time.

Installation

WordPress Admin Installation

1. Download the latest version of the plugin from GitHub.
2. In WP Admin, go to Plugins → Add Plugin → Upload Plugin and upload the .zip file.
3. Activate the plugin once it has finished installing.
4. If you need to stop the plugin from displaying the global header, footer, or TrustArc elements, you can configure these options from the plugin settings page in WP Admin.
5. For more detailed instructions, see this KB article.

Composer Installation

The plugin can also be installed and managed with Composer.

Add the Global Elements GitHub repository to the repositories section of your project's root composer.json:

{
    "type": "vcs",
    "url": "https://github.com/ITS-Digital-Technology/global-elements-wordpress"
}

Then install the plugin:

composer require its-digital-technology/global-elements-wordpress

Composer discovers available plugin versions from the repository's Git tags and adds the appropriate version constraint to your project's composer.json.

A complete example might look like:

{
    "repositories": [
        {
            "type": "vcs",
            "url": "https://github.com/ITS-Digital-Technology/global-elements-wordpress"
        }
    ],
    "require": {
        "its-digital-technology/global-elements-wordpress": "^1.6"
    }
}

Projects using composer/installers can configure WordPress plugins to install into the appropriate plugins directory. For example:

{
    "extra": {
        "installer-paths": {
            "./wp-content/plugins/{$name}/": [
                "type:wordpress-plugin"
            ]
        }
    }
}

To update the plugin to the latest version allowed by the project's version constraint:

composer update its-digital-technology/global-elements-wordpress

CampusPress Installation

For sites created on CampusPress hosting through Sites at Northeastern, this plugin is included and activated in all current templates by default.

TrustArc Visibility

Some themes may apply a fixed height to iframe elements. This can interfere with the TrustArc modal.

To test, open the Cookie Preferences link found as the last item in the global footer. If the TrustArc modal is partly obscured when open, override the theme's iframe styling with:

.truste_popframe {
    height: var(--truste-popframe-height) !important;
}