11# ASU Brand module for Drupal
22
33The ASU Brand module provides the following functionality:
4- * An ASU branded, accessible, Web Standards compliant Header with integration
4+
5+ - An ASU branded, accessible, Web Standards compliant Header with integration
56 with ASU search and spplying required links. The header provides navigation
67 menu which you can configure through the Drupal admin user interface. More
78 details on configuration below.
8- * ASU Universal Google Tag Manager. Enabled and included in your site's markup
9+ - ASU Universal Google Tag Manager. Enabled and included in your site's markup
910 automatically without any configuration needed by you. Should you want to
1011 turn it off or wish to add an additional GTM container ID, visit Admin ->
1112 Configuration -> ASU Brand settings.
12- * ASU branded Cookie Consent for GDPR compliance. On by default. No
13+ - ASU branded Cookie Consent for GDPR compliance. On by default. No
1314 configuration necessary.
1415
15- Find more technical details about the header, GTM and cookie consent on
16- [ unity.web.asu.edu ] ( https://unity.web.asu.edu ) .
16+ Find more technical details about the header, GTM and cookie consent on [ unity.web.asu.edu ] ( https://unity.web.asu.edu ) .
17+
1718## Installation instructions
19+
1820The ASU Brand module installs when you create a Webspark site. If you're
1921using this module outside of Webspark or in other situations, see the
2022instructions below.
23+
21241 . Install and enable the ASU Brand module just like any other module.
22252 . Go to the Admin -> Structure -> Blocks and place the ASU Brand header block
2326 into the header region of your site. Please note that the header supplies
2427 its own header tag, so you may need to update non-Webspark themes to ensure
2528 they do not set their own header tags. The available regions will be
2629 determined by the theme that you are using.
30+
2731## CAS integration
32+
2833The default login/out paths used in the ASU Brand header assume you have the
2934CAS single sign on module enabled. CAS should be included and installed by
3035default in Webspark sites. If needed for implementations, install and enable
3136the CAS module to allow users to create accounts and authenticate to your site.
37+
3238## Note on caching
39+
3340The ASU Brand header is cached for performance. When you make updates to the
3441menu used in your header, please clear the cache to see your updates
3542immediately. In the Drupal UI, go Admin -> Configuration -> Performance to
3643clear the cache.
37- ## How to configure your header
38- Webspark sites install with the ASU header enabled and placed in the site
39- layout by default with the Main menu configured as the header menu. Should
40- you wish to reconfigure your header, or to add an additional header to your
41- site, such as for a subsite or microsite, navigate to Admin -> Structure ->
42- Blocks and place an "ASU brand header" block into the header region of your
43- site. Each header block you create has its own independent settings. Most sites
44- will only ever need one.
45-
46- Within the ASU brand header block settings, you may change the settings of your
47- header, but the defaults should work for most situations.
48- ### Columns within dropdown menus
49- To create a menu column add a menu link at the second level of your menu and
50- configure it with the "Heading - starts a column" setting in the "ASU Brand
51- menu link type" dropdown. All menu links at the second level following that
52- header will be in that column until the next "Heading" menu link is
53- encountered and a new column will start.
54- ### A note on buttons in the menu
55- There are three types of buttons available in the menu.
56- 1 . Top level call to action buttons display alongside the top level menu items
57- and are configured in the block configurations.
58- 2 . Buttons within drop down menus' columns are configured on menu link item
59- forms using the "ASU Brand menu link type" dropdown.
60- 3 . Buttons in the tray at the bottom of drop down menus are enabled by clicking
61- a menu link item's "Display as ASU Brand button in dropdown tray" checkbox.
62-
63- For 2 and 3, enabling the button settings will transform that menu link into
64- the corresponding button type ONLY if that menu item is in the second level of
65- your menu. If those menu link fields are configured in non-header menus, they
66- will be ignored.
67- ### Header menu depth
68- Only header menu links at the top and second level are displayed in the header.
44+
6945## Other configurations
46+
7047Global configurations related to GTM and Cookie Consent are found at the
7148following click path: Admin -> Configuration -> ASU Brand settings.
49+
7250## Header assets
51+
7352Previous version of the ASU Brand header loaded the header from external
7453sources. The Webspark 2 version of the module, now ships with all header assets
7554from the Unity Design System "components-library" header component onboard.
55+
7656## A note about toolbar menus
57+
7758The ASU Brand header is designed to work with the Drupal core toolbar menu used
7859to provide administrative system links. A popular Drupal module, the Admin
7960Toolbar, which provides dropdown menus from the toolbar, is not currently
8061supported.
62+
8163## Help! The header overlaps my content or UI!
64+
8265The ASU Brand header uses fixed positioning, and that can lead to issues with
8366other fixed positioned elements in the UI. We've attempted to catch and supply
8467CSS rules that make adjustments for those UI elements provided in Webspark. If
8568you have customizations or added modules that are overlapped, you can use the
8669following CSS to deliver UI adjustments:
8770
88- ```
71+ ``` css
8972body .asu-brand-header-present {
9073 /* Your rules here. See css/asu_brand.header.css for examples from this
9174 module. To see how the ASU Brand module uses Javascript to detect and
9275 apply necessary changes related to the header, see
9376 js/asu_brand.header.js */
9477}
9578```
79+
9680## Extending the Google Analytics dataLayer
81+
9782The ASU Brand module initializes a Google Analytics dataLayer for use by
9883frontend Unity components. The dataLayer has been implmented so that
9984modules may take advantage of it as well using the
@@ -103,7 +88,7 @@ the developer implementing to ensure it behaves as desired and doesn't
10388interfere with other dataLayer usage on existing pages. If you test this,
10489we would appreciate hearing about your experience.
10590
106- ```
91+ ``` php
10792function hook_asu_brand_gtm_datalayer_alter(array & $datalayer) {
10893 // Set a "site" variable return.
10994 $datalayer['site'] = 'My Site';
0 commit comments