National Nurses United (NNU) is the largest union and professional association of registered nurses in the United States (US). NNU has unified three of the most active US nurses organizations: the California Nurses Association (CNA) / National Nurses Organizing Committee (NNOC), United American Nurses, and Massachusetts Nurses Association. NNU's charter is to focus on the improvement of patient care conditions and standards for nurses.

NNU chose Hook 42 to redesign, architect, and build their new Drupal 8 website. The project had a very tight timeline due to the end of life of their hosting provider. Hook 42 worked efficiently with the NNU team to get a successful D8 site up on time and under budget.

National Nurses United Pages
Why Drupal was chosen: 

National Nurses United (NNU) wanted an Enterprise-level CMS to streamline content creation, content management, and site administration. The CMS needed to support reusable and responsive page templates for several types of content including microsites. Some other desired features included robust tagging, useful WYSIWYG, content blocks, a query builder for content reuse, and good mobile support. NNU's previous site was on an old version of ExpressionEngine with the content in a MySQL database.

Given NNU's requirements, Drupal 8 was a natural fit for their new website. Drupal 8 is responsive out of the box and has a solid WYSIWYG ready to go. With Views in core, creating lists of content is even easier than before. Robust tagging and reusable content blocks have been an essential part of Drupal for a long time. And, with the migrate module, pulling content out of the ExpressionEngine MySQL database, would be straightforward.

Describe the project (goals, requirements and outcome): 

High-Level Goals

  • Light design refresh with more current feel
  • Modern and robust content management system
  • Design, build, and launch in very tight timeframe

Requirements

  • Launch by October 15, 2017 (hard deadline)
  • 3.5 months from start to launch
  • Move to new hosting provider (old hosting was going away)
  • Light design refresh (due to time constraints)
  • Adhere to good design principles
  • Follow existing brand guidelines
  • Follow development best practices
  • Enterprise-level CMS
  • Streamline content creation and management
  • System can be easily extended in the future
  • Reusable and responsive page templates
  • Microsites for affiliates
  • Robust tagging support
  • WYSIWYG page editor
  • Mobile support for tablets and phones
  • Query builder to filter content
  • Integration with Blue State Digital CRM forms
  • Content migration of 5000+ pages
  • Migration from old ExpressionEngine site
  • Image migration from Flickr
  • Handle 10+ types of page content
  • Launch and post-launch support
  • Regular site backups
  • Customized Drupal training

Migration Approach

Since the repackaged ExpressionEngine (EE) site was very old and could not be duplicated, we went straight to the source MySQL database for the content migration. The new hosting platform is Pantheon, so we imported a copy of the live EE MySQL database into a Pantheon "site" to do a source to destination migration completely within the Pantheon infrastructure.

Since we were grabbing content directly from the MySQL database, we had to reverse engineer how the EE database structures mapped to the EE content within the old site's UI. Due to the lack of dev and staging environments and that a duplicate EE site could not be created, this analysis was done on the live EE site which was risky but successful.

We analyzed the content to determine which migrations should be manual and which should be automated. Some of the content, such as jobs, only had a small number of pages, so we chose to migrate those manually. There was also microsite content for a number of affiliates that was being heavily reworked for the redesign so was manually migrated.

For content that had many items such as blog and news articles, we did automated migrations from the source MySQL database into the new Drupal 8 site. Because of the very compressed timeline, we did a "blob to body field" migration. In this approach, the original "blob" (unstructured) content was migrated directly into the Drupal 8 body field for the particular type of content.

Structured content fields were also added to these content types to allow content editors to slowly transition content from the body field into the structured fields over time. The structured content provides the editors with easier content management and more flexible layouts. In general, this is a very good approach when either you have a tight timeline or your content editors want more time to experiment with the new content editing tools without holding up the site launch.

For the automated migrations, we created custom source and process migration plugins within the Drupal 8 migrate framework. For example, we were requested to pull in external Flickr images into Drupal to eliminate the dependency on the external site. We created custom plugins for handling Flickr images that were embedded in WYSIWYG blobs. Our code identified hardcoded Flickr URLs, used curl to get the image data, saved the image data as file entities within Drupal, and updated the URLs within the content so images were still functional.

For more information on migration approaches, you may want to check out the Planning & Managing Migrations talk from DrupalCon Baltimore.

Outcome

  • Successfully launched on time and under budget!

  • Since project was under budget at launch, we added additional features and provided customized training after launch and are continuing to improve the site and train the NNU team
  • The NNU team now has a powerful and modern content management system to provide their professional members with timely information and tools

Technical specifications

Drupal version: 
Drupal 8.x
Why these modules/theme/distribution were chosen: 
  • Back To Top: Easy way for users to jump to the top of the page.
  • Bootstrap Layouts: Leverage Bootstrap layouts from within Display Suite.
  • Bootstrap Paragraphs: Surface a number of useful Bootstrap content components such as accordions and tabs.
  • Component Libraries: Extend Twig files for more reusable theming.
  • Configuration Update Manager: View configuration management reports in the UI.
  • Contact Formatter: Show a rendered contact form on another page.
  • Display Suite: Add additional settings for view modes.
  • Entity Embed: Embed images and videos within a WYSIWYG area.
  • File (Field) Paths: Specify path and directory names for tidy file management.
  • Focal Point: Allow content editor to center cropped images better.
  • IMCE: Easy file uploading for content editors.
  • Media entity: Used for media management (moved to core in 8.4).
  • Media Entity Image: Used for image management.
  • Menu Block: Show part of a hierarchy of a menu.
  • Migrate / Migrate Plus / Migrate Tools: Used to migrate from ExpressionEngine MySQL database.
  • Paragraphs: Provide content components to content editors.
  • Paragraphs Edit: Better content editor UX for content components.
  • Social Media Links Block and Field: Easy way for content editors to add social media links.
  • Twig Tweak: Easier for front-end developers to grab data from within Twig.
  • Video Embed Field: Content editors can easily embed videos from Youtube.
  • Views Reference Field: Create content that references Views for content reuse.

In addition to the modules above, there are many standard modules that we used (and almost always use on projects) such as Chaos Tools, Devel, Diff, Entity, Field Formatter Class, Field Group, Google Analytics, Honeypot, Libraries, Link Attributes, Menu Attributes, Metatag, Pathauto, Pathologic, Redirect, Sitemap, Token, and View Unpublished.

Organizations involved: 
Project team: 
  • Aimee Hannaford (Degnan): Principal Architect
  • John Nguyen: Technical Project Manager
  • Ryan Bateman: Drupal Full-stack Developer
  • AmyJune Hineline: Drupal Developer
  • Carie Fisher: Senior Drupal Front-end Developer
  • Christopher Doherty: Senior Drupal Front-end Developer
  • Darryl Richman: Senior Drupal Developer
  • Jeff Mahoney: Senior Drupal Developer
  • Erald de Hoog: Senior Drupal Developer
  • Idil Sabbagh: Infrastructure Specialist
National Nurses United Home Page
National Nurses United California Nurses Association Page
National Nurses United Safe Staffing Saves Lives Campaign
National Nurses United Home Page Footer Call to Action
National Nurses United Mobile Home Page Footer
National Nurses United Mobile Top Level Menu
National Nurses United Mobile Sub Level Menu
Sectors: 
Healthcare