Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
By Woolwich Web Works on
In mid-2016, LabX Media Group (a successful science media company), decided to launch a new conference series. Woolwich Web Works had worked with LabX on several other projects, so they turned to us for website development. They needed a website up and running quickly, so they could start marketing the conference a year before the Conference would be held.
We used an iterative approach to development, adding features and making improvements progressively. The conference marketing cycle required different features to be available at different times. Drupal 8’s configuration management combined with a composer-based development workflow made it easy for us to adapt to the client’s changing needs.
This project is a great example of what Drupal 8 can do (almost) out of the box. The main functionality for the site was created with core Drupal 8 modules: entities, references, views, and user roles and permissions. The biggest contrib module addition was the Paragraphs module, for creating structured content layouts. Many other helper modules were used to improve content display and user experience.
Why Drupal was chosen:
The client had spoken to a colleague who had been running similar sized conferences on a related topic. The colleague gave our client permission to copy their Wordpress site and modify it for their new conference series.
We considered this seriously, but came across a couple of caveats. Firstly, we knew that they would want to customize things. The colleague’s Wordpress site would only be a starting point for both design and functionality. We also knew that deploying changes to test, staging and production environments would be a problem with Wordpress. Drupal 8’s configuration management features would make this easy.
We noticed that the Wordpress site was using simple contact forms for soliciting presentation proposals. The site editors had to manually enter all of this information once the conference schedule was finalized. We knew we could improve on this with Drupal. Presentation proposals could be submitted as nodes, and editors would only have to review, edit and approve them.
Finally, we had developed a number of other sites for the client using Drupal, so it fit in with their existing workflow.
Describe the project (goals, requirements and outcome):
Goals:
The goal of this project was to create a website for a conference that would:
- Evolve through the one year marketing cycle for the Conference
- Display content in attractive page layouts including text, images, videos, and other types of content
- Allow users to submit session proposals (“Abstracts”), which could be reviewed by site administrators and posted publicly on the site.
- Display structured content such as the conference schedule, exhibition Floor Plan, and sponsorship opportunities
Project Timelines
The project began with a quick timeline and an iterative approach. We needed a basic site structure in 6 weeks so the client could begin promoting the conference as soon as possible. We started with the inspiration site and immediately began building: no wireframes, no static mock-ups. Once the clients started using the working website site they had a better idea of what they actually wanted and how things should work. The first phase of the The Scientist Expo website launched in September 2016, with promotional content and information for exhibitors and potential sponsors.
The next phase launched in January 2017. It included a process for prospective speakers to submit their session proposals (or “Abstracts”).
Project Requirements
Adapt to the Conference marketing cycle
Marketing the conference would be a year long process. New content and features would be added to align with promotional activities happening throughout the year. For the website content, editors can simply disable menu items and unpublish content when it is not needed.
For changes to functionality, Drupal 8’s configuration management makes deploying changes easy. We don’t have to worry about managing complicated Features. All we need to do is export the configuration, commit it to git, and import it on the test and production sites.
Engaging page layouts & structured content
The site needed to make it easy for editors to create content that would be presented in a useful and engaging way. Some of these elements were simple, such as the conference schedule. Others were more complex, such as the exhibition floor plan. We used the Paragraphs module extensively to create building blocks of content.
A good example of Paragraphs in use on The Scientist Expo is on the Hotel page:
Abstract (session) submission
After the initial launch, we began creating a process for site visitors to submit presentations (or “Abstracts”) and for site editors to review and approve them. We went through several methods of doing this, but finally decided to require user to create accounts and allowing those users to submit new Abstract and Speaker nodes. This enabled users to manage their own speaker profiles, and to submit multiple Abstracts. The speaker and session information is hidden from view until the site administrators approve them and assign them to a date and time slot at the conference.
Interactive Exhibition Floor Plan
The Exhibition floor plan was a particular challenge. The client had pointed us to several elaborate conference floor plans, with booth vendor information displaying on hover. We also discovered that in Wordpress there are plugins that make this easy.
There is a similar module for Drupal 7 (a sandbox module, and not well maintained). We did consider upgrading this module to Drupal 8. However, we realized that we could create the same effect using a custom entity combined with some special theming.
Good User Experience
We were careful to consider the user experience for users as well as site editors. For site editors, a particular problem was Paragraphs module. It allowed us to present a lot of structured content in interesting and useful ways, but it also created very complex forms. If the forms get too long, it’s difficult to drag and drop the paragraphs to reorder them. We made many small improvements to the display of Paragraphs forms using the Conditional Fields module and a custom admin theme.
For speakers, it was important to make sure the Abstract submission process was user friendly. We added some custom feedback to the user profile screen so they can see what content they may be missing, what they can do next, and what the status of their submissions are.
Example of an incomplete user profile:
Example of a completed user profile
Coordinating with Third-party Services
There were a few components of this project that would have been very expensive to develop using Drupal. Conference registrations and payments is one example. At the time, Commerce for Drupal 8 was not quite ready yet. Being an early adopter would have been interesting for us, but expensive for the client. Integrated eCommerce would have been overkill for a simple when a third-party registration service could do the job just as well.
The client also chose to use HubSpot and SparkPost to manage contact forms and email notifications. This keeps all their notifications in one place, tracks user interaction, sends attractive HTML emails, and allows the marketing team to respond directly to user actions (or inactions).
These are both items that would have difficult and expensive to implement using Drupal. By using third-party services, the client can get a robust, user-friendly solution at a reasonable cost.
Staff training and documentation
The company was hiring two new staff members to administer the site and do other marketing and administrative tasks. We worked closely with the new team, using both screen sharing and extensive documentation to help them learn how to administer the site. A 10-page editor’s guide was created to help them through every step of the process.
Technical specifications
Drupal version:
Drupal 8.x
Key modules/theme/distribution used:
Why these modules/theme/distribution were chosen:
They key functionality for this site is native to Drupal 8: entities, references, user roles and permissions, and configuration import/export.
Some of the modules listed above were chosen to improve usability for website editors. These include Better Formats, Conditional Fields, Field Group, and Simplify.
Several other modules were chosen to help with content displays. For example: Views Reference allows us to embed a view within a Paragraph.
Others were chosen to help facilitate the abstract submission and approval process. For example, Field Permissions are used to set some fields to be editable by site editors only (e.g. the abstract presentation date field).
There is also a custom module that does a variety of small tasks. One problem we encountered is that users cannot create references to unpublished content. To work around this, a custom function immediately unpublishes both the abstract and speaker nodes after they have been created. When the site editor approves (publishes) an Abstract, the custom module automatically publishes the referenced Speaker node. The custom module also gives newly registered users the "speaker" role and creates some of the custom messages that appear on the profile screen.
Community contributions:
When this site was developed, we found that contrib modules for Drupal 8 were in widely varying states of development. Some didn’t work at all, others were very buggy, and some had minor bugs. Solutions to problems were often difficult or impossible to find.
We contributed to the Drupal 8 ecosystem by submitting bug reports and feedback to contrib modules. We documented solutions to problems on Drupal.org forums and/or other websites We have also started a live stream + YouTube video series to share some of what we have learned while developing this site, and others, on Drupal 8.
Organizations involved:
Team members:
Project team:
The Scientist Expo was built by Woolwich Web Works: a small but capable development team located in Waterloo, Canada. Using open source tools allows a small team to do big things on a reasonable budget.
