Drupal customizations
This page outlines the customizations by NHM developers made after the initial build in 2018 and before the onboarding of NHMLAC's Drupal maintanence vendor Zivtech in 2022.
"Mind blown"
An example of a mind blown page on the live site can be found here.
This project was to address the lack of creating collections of thematic pages. To create a collection of an hierarchical order of pages that have commonality, the content type List was used. A List combined with a View was used to create the Mind Blown pages. Elements added to the List are ordered.
Elements added to the list are displayed as teasers. The "Self guided tours" is a List Display that is a series of nodes that content editors can add to. The list display allows for different display types, which are views that redisplay the pages (i.e. grids, sliders ect) .
They are a list of pages that can be grouped together where the order they display can be set by an editor.
They are paragraph combined with a View (display) and a field referencing the List content type with listed page elements.
Story Page
Stories example (opens in a new tab)
The Story Page was originally a view, but as more features were requested it eventually became a content type.
A story page is a view that has a unique display to show a list of stories and side bar content that are blocks. The side blocks include:
-
Staff picks
A list that editors can manually add elements and rearrange. Play signs are added to video/audio elements.
-
Our Channels
A list of external links which can be manually added and rearranged.
The dropdowns at the top of the page are views that filter content based on the user selection or the "Search stories" searchbar in the righthand sidebar.
The search bar in the sidebar was a requested feature. It is a superficial field that sends search requests via AJAX to a form fields titled Excerpt (field_excerpt) with class js-form-item-excerpt and the Title field. This field searches through the title field and "excerpt" field of stories. Authors field the excerpt field of their stories with key words for this search.
Member login menu
Desktop
On the global menu for all museums, the MEMBERS option is a dropdown with a Login option.
This was done with JS. This is a hierarchical member where "Login" is a node under "Members". The container class members was added to the "Members" menu option which acts as a selector for the JS to allow for "Members" to be a dropdown.
This was done so the other menu items, which are hierarchical, would not have dropdown menus attached to them. The JS solution allows for only "Members" to utilize a dropdown menu.
Mobile
Mobile devices have a different menu. On the mobile menu, the login option is no longer parented under a "Member" dropdown but is instead an option in its ownright as a button. This solution would not account for other options having dropdowns on mobile (since the mobile menu has no hierarchy built-in).
Icon tiles
Icon tiles allow for icons to be reused.
When a landing page or a basic page is created a widget titled Icon Grid allows for new or existing icon tiles to be displayed. An example of this functionality might be creating a grid of saftey icons for Covid-19 precautions or a grid of author photos that is reused in Stories.
Magazine content type
https://nhmlac.org/naturalist/jan-feb-2021 (opens in a new tab)
Magazines curate and manage content with a large amount of widget customization.
They allow for feature images to with custom captions, call to actiosn with custom icons and modifiable texts. The following elements can be images or audio previews. These elements are split width-wise by 75% and 25% of the vw, alternating by row.
The "Share your wonder with us" section is powered by Gleam.
Magazine pages consist of a Feature and the Full content elements whcih allow for overrides. When no overrides are applied, it will automatically display info from the linked content or the default settings. The alternating 25%/75% display for the Full content paragraph magazine elements is applied automatically.
Date Recur Widget
Switched out "Date Recur Interactive Widget" (original widget) for "Date Recur Modular Widget Framework" (new widget).
This was done because the original widget did not handle all date ranges well. In particular it did not properly handle date patterns over a range with specific omissions, such as: "a date range for only Tuesdays excepting certain Tuesdays in a given year".
On the Date recur field in the Event structure type, currently the only option that allows for this complex date occurence is Modular: Sierra.
Translations
Currently there are translated pages, but no way to properly have a langauge switcher (a feature to be implemented with Drupal 9). This feature would allow for urls to reflect the translated page with ISO standards (i.e. en-us or es-mx) and hreflang (opens in a new tab).
A "Content Variation Settings" tag, coded for language, currently allows for content in a specific langauge to be pulled by a view. In the future, when langauge switching is a feature with a Drupal 9 website, 301 redirects can be done using such a view.
