Drupal 7 will reach end of life on January 5, 2025. The Drupal Association has confirmed that there won’t be any more extensions to the deadline! 

If you haven’t already, make sure you’ve read about the risks of staying on Drupal 7 and our recommended actions. 

If you’re reading this article, chances are you’ve decided your site’s future lies with Drupal 10. That’s exciting news—there are tons of great features waiting for you on the other side of the Drupal 7 to Drupal 10 migration!

So let’s take a look at what it’ll take to get you there. While each migration project is unique, you can generally split it up into the steps below. 

1. Review your Drupal 7 website

Moving from Drupal 7 to Drupal 10 is a big step. So take it as an opportunity to plan your site’s future and assess its structure, content, functionality, and design. 

Here are some questions to get you started:

• What do you want from Drupal 10? Envision how you’ll leverage Drupal 10’s features to enhance and grow your digital presence. Consider setting up a sandbox environment to play around in. 
• Does the current structure work well? Think about how you could improve the information architecture to make your new site easier to navigate. 
• What needs to be migrated? Consider if you need all of the current functionality and content. You might want to optimize or rewrite your content. Creating a data transfer table (DTT) will help you map old and new content structures and reduce the risk of losing data.
• Does the design need a refresh? Explore opportunities to update the look and feel of your site to make your brand shine. 
• Does your code need an overhaul? This is a good time to revisit custom code and bring it up to speed with best practices and modern standards. 
• How big of a job is it? Complex, multilingual, and content-heavy sites often present additional challenges that require more resources and expertise. 

Need some guidance? Consider getting a site audit, digital strategy, redesign, or migration support from an expert partner like Evolving Web. As a Drupal Signature Supporting Partner with 16+ years of experience, we can help you move forward with confidence. 

2. Check Modules Availability

Are you using contributed modules to extend the functionality of your Drupal 7 site? If so, you’ll need to check that they’re compatible with Drupal 10 or find an alternative before you migrate. 

You can do this by manually checking each module’s page on drupal.org, or by using a tool such as the Upgrade Status module.

Even if your existing modules are Drupal 10 compatible, it’s worth taking a look at alternatives as the Drupal community might have created better solutions. If you want a better alternative but there isn’t one available, you can ask an agency with development services to port the module to Drupal 10. 

Also, see what new modules you can use with Drupal 10 that you couldn’t with Drupal 7. For example, take a look at these 5 modules that enhance CKEditor 5, the default WYSIWYG editor in Drupal 10. 

3. Create Your Drupal 10 Website

You’ll need to create a brand new website using the latest version available (Drupal 10.1 at the time of writing). 

Install the modules you selected in the previous step. Remember that the installation process will be different in Drupal 10 than it was in Drupal 7. 

Set up your content structures including blocks, content types, media types, webforms, and menus. Consider taking advantage of Layout Builder—a core module since Drupal 8.5 that replaces the Panels module. Layout Builder’s powerful drag-and-drop functionality makes it easy to build attractive, flexible pages. 

4. Update Your Code

Try and use existing contributed modules where possible to reduce the need for custom code. Any custom themes will need to be recreated from scratch. Check out our guide on how to use a Single Directory Components approach to theming.

Use best practices and modern coding standards. Remember, Drupal 10 requires at least PHP 8.1 and has updated database requirements. Check out our guide to porting CKEditor plugins to Drupal 10.

Implement your custom modules and themes on your Drupal 10 website. 

5. Migrate Your Data

If you don’t have much content, you might be able to manually migrate it from the old site to the new one. Otherwise, you’ll probably want to automate the process. 

If you do an automated migration, you can use the Migrate API to move over content and configurations. Make sure you understand its limitations and have a plan for managing them. For example, you may need to recreate views with the views migration module.

Other helpful modules for migration include Migrate Plus, Migrate Tools, and Migrate Scanner.

Complete migration for one content type and before starting to work on others. This will save time as you’ll be able to use the first completed migration as a template for the rest of them.

If you need to migrate a huge amount of content, it’s better to run migrations via Drush than UI so that it’s easier to roll back and rerun them quickly.

Before you migrate:

• Clean up content and data on your Drupal 7 site 
• Update your old site to the latest Drupal 7 version
• Back up your data in case something goes wrong 
• Announce a content freeze so that nobody updates the old site during migration
• Make sure old URLs are redirected to avoid 404 errors

6. Test Your New Site

Systematically test and QA your new website to ensure it’s secure, performant, and accessible across various devices. Check that all of the content and data have been migrated correctly. Finally, get approval from the necessary stakeholders.

7. Launch! 🚀 

Let your audiences know about the upcoming change. This is a nice opportunity to show off and explain how it benefits them! 

Update your site's DNS settings to point to your Drupal 10 website. Re-implement any old redirects or custom URLs, and watch for any 404 errors or other warnings in your logs. 

Lock down your old Drupal 7 site so that it’s secure and can’t be accessed by the public. You may want to eventually create a static copy and a backup for reference. 

8. Continue to Evolve Your Site

• Train your team to use Drupal 10. Give them the skills and confidence to independently update your site with our custom training or Drupal Learning Tracks.
• Keep your new site secure. Implement security patches as soon they’re released. You may be able to use the Automatic Updates module to make the job easier (this module won’t work if you’re using a hosting platform such as Acquia or Pantheon.) 
• Nurture your digital presence. It should be a living thing that’s always adjusting to stay relevant and valuable. Keep UX/UI considerations at the front of your mind.
• Explore new modules. The Drupal community is continuously creating fresh solutions. You can easily search modules within the Drupal 10 admin UI using Project Browser.

Embrace innovation. Drupal is gearing up for radical transformation that’ll bring you even more possibilities, such as the adoption of AI technologies.

A round-up of our learning and conversation shared at DrupalCon Lille.

At DrupalCon Pittsburgh, a team of interested community members submitted The Drupal API Client Project to be considered for funding as part of the Pitchburgh Innovation Contest. (If you missed it, check out our pitch video below, along with the original proposal.)

Are you a proud Drupal website owner who dreams of a smooth and seamless upgrade process? Migrating your website to a newer version of Drupal can seem like a daunting task, but with the right techniques, it can be done in a snap. In this blog post, we'll discuss a different approach to Drupal migration that will save you time, hassle, and potential headaches.

Welcome to the third edition of the Pitchburgh Diaries, a regular update on progress as we work on our plan for a decoupled Layout Builder with React.

Sprints 5 and 6 were our final sprints in the project. Keep an eye out for a final wrap-up and summary of the next steps, which we’ll publish in the coming weeks.

Bundling and extending

In this sprint, we focused on the nuts and bolts of how contrib and custom code will extend decoupled Layout Builder functionality.

We began by creating a new Drupal 10-compatible version of the React module. Thanks to @corbacho for adding us as co-maintainers for the project! 

When we bundle the decoupled Layout Builder code for use in the browser, we don't include React. Instead, we rely on the React module to load it. This allows other modules that need React (e.g. Gutenberg) to use a shared version of React. React doesn't work if two versions are loaded on the same page.

The new version of the React module makes use of a relatively new browser API called import maps. Import maps allow you to write ECMAScript modules (ESM) with naked imports and have the browser resolve the dependency for you.

So, for example, our bundled code still has import React from 'react' in it. With an import map, the browser can resolve that to a Javascript file and load it for you.

To support this functionality, we wrote and released an import maps module which both the Decoupled Layout Builder API and React module make use of. We believe this functionality belongs in core because you can only have one import map on a page. So we opened a core feature request for that too.

With this module in place, bundling for contrib and custom code that wants to add additional components to the decoupled Layout Builder becomes much simpler. Essentially the build configuration needs to mark imports of React, React DOM, the JSX runtime and the decoupled layout builder components as 'external'. This ensures the bundled code retains the original import statements. Both Vite and Webpack support this feature. 

For those who recall how we built ES6 code in Drupal 9, you would know we had scripts in core's package.json and webpack configuration to transpile it into code that worked in older browsers like Internet Explorer. With Drupal 10, we removed that step as all of our supported browsers have native support for ES6 code. Similarly, if you've built a CKEditor 5 plugin, you would know it also uses Webpack for bundling.

As a result, Webpack felt like the natural choice for bundling here too. WordPress uses it to bundle block components for their Gutenberg editor. However, the web landscape moves quickly. The tool we chose N years ago may no longer be the best choice. With all modern browsers supporting ESM, the bundling landscape has changed. 

Those who follow front-end web development would know that many projects are actively moving away from Webpack towards Vite. Storybook added support for Vite in v7, and just last week, Remix had a major announcement about Vite support. CKEditor5 has also added Vite support. For this reason, we evaluated both Vite and Webpack for use in our utility Drupal scripts package. Thispackage is designed to make writing and bundling code for use with the decoupled Layout Builder simpler. Based on our evaluation and the broader front-end landscape moving towards Vite, we chose it for our bundling.

As a result, we have an npm package @drupal/scripts that we will release in the coming weeks with the following features:

• A simple build step. No need to manage your own bundling configuration - just add a dependency on @drupal/scripts (more on that below) and add this to your package.json for building - drupal-scripts build -o js/dist js/src 
• A simple setup process - if you install the package globally, you can run drupal-scripts init to have it automatically update your package.json with the required changes
• Support for scaffolding components for use with decoupled Layout Builder - just run drupal-scripts generate and follow the steps.

Feature development

In our first four sprints, we focused on building the Layout Editor in a decoupled application. We were mocking APIs so development could occur without a Drupal site.

In these two sprints, we switched to instantiating the Layout Editor in an actual Drupal site.

The Layout Editor uses React components that mirror Blocks, Formatters, Widgets and Layout plugins from Drupal. We have always intended for these to be the extension points for the application. If you need to change how any of those work in a project, you should be able to swap in your own custom React component.

To facilitate this, the entry point for the decoupled Layout Builder is the Layout Editor component. It takes a map of components for each of the Blocks, Formatters, Widgets and Layout plugins. This map is keyed by the plugin ID (same IDs as in Drupal). The values of the map are a function that return a promise, that will resolve the components. What each component comprises depends on the type. 

For example, a Block component needs an Edit and Preview component but might also need a Settings component. You can read more about what each component comprises in the storybook documentation.

In order to boot the Layout Editor, Drupal needs to construct these maps. To do this, we make use of existing plugin definitions and extend them to add an entry for the decoupled Layout Builder. 

Here's an example of nominating the path to a React component for a layout plugin:

In this example, the file MyLayout.js would be scaffolded with the drush-scripts generate command and updated according to the documentation for a Layout component.

In the Decoupled Layout Builder API module, we replace the default LayoutBuilder render element with a decoupled one. When this component is rendered, it loops over all of the block, formatter, widget and layout plugin definitions and builds up a mapping from ID to component path. This is then stored in drupalSettings. The element also attaches some Javascript to boot the React application that reads this value back and turns the file paths into promises using the browser's native import operator.

With all this in place, we were able to boot the new Layout Builder in Drupal 🎉. Here's a screenshot of that for the Recipe content-type in the Umami demo profile:

Other key highlights

So, while we've focussed mainly on the big ticket items, we were also able to complete a fair few of our other wish list items in these final sprints, including:

• Fallback rendering when no React component exists - as seen above, we're able to fallback to Drupal rendering where no React component exists yet
• Support for layout builder restrictions so that you can only drag and drop components into supported regions
• Support for saving changes in Drupal - including autosaving
• General improvements to Drag and drop so that it was easier to drag new components into existing regions
• General normalisation improvements so that section and region UUIDs are generated Drupal side and stored in third-party settings.
• GitLab CI integration so that Storybook builds on every push.
• Additional documentation and tests.
• Layout settings pane

Where to next

We've reached the end of our sprints for Pitchburgh. But that doesn't mean the work stops. We plan to continue working on the project and have quite a backlog of new features we'd like to add.

In our next post, we'll recap each of the completed stories for our Pitchburgh grant statement of work, go into more detail about our future plans and let you know where you can help.

Tagged

Recognize the problem that your Drupal website is not sending emails? For example, when there's a (security) update or when someone has filled out a Webform. In this blog, I'll show you in a few simple steps how to ensure that the emails your Drupal website sends always get delivered.

The Drupal Association is here to update you on all of the exciting things you may have missed that happened at the conference! From a focus on marketing to updates on innovation, there was much to see and do at DrupalCon. Lille, France, was the perfect city for the Drupal community to unite. Easily accessible from major cities such as London and Paris, it was a bustling city of fantastic cuisine (did you try Le Welsh?!), shopping, museums, and culture. Continue reading to learn more about the latest updates from Europe’s largest Drupal gathering.

Day One

On Day One of DrupalCon Lille, things kicked off with the Driesnote, a colorful presentation that took us through a fairytale story fitting for such a historic city. This fairytale took attendees through the Drupal village, learning about the main character Drupal, and other unique villages that Drupal visits along the way: Reactopia, Contentville, Squarix, and Edoby Heights. Drupal stopped along the way to meet with the Drupal Marketing Wizards. A key initiative for the Drupal Association Board’s Strategic Plan is to amp up the marketing of Drupal as a product, and the Driesnote introduced us to Suzanne Dergacheva, Lynne Capozzi, and Nikhil Deshpande. As leaders of the new Drupal Association Marketing Committee, these three marketing wizards are working with a core group of community members to create a product marketing plan to boost Drupal marketing.

Other critical topics from the Driesnote included Drupal’s impact on creating a safe and secure web for everyone and the Open Web Manifesto, as well as Drupal’s latest updates and innovations. You can read more about the DrupalCon Lille Driesnote in Dries’ blog post.

During the opening ceremony, three well-deserving nominees received the Women in Drupal Award! The Define award went to Tiffany Farriss, the Build award went to Marine Gandy, and the Scale award went to Lenny Moskalyk. Congratulations to all three recipients, and thank you for all your work for Drupal and the community!

Continuing with Day One, we saw an update on the Project Browser Initiative with Leslie Glynn and Chris Wells. They discussed the current state of the initiative, including the usability testing they have been conducting, the plan for the UI and Markup, as well as their roadmap for the initiative, and various opportunities to contribute. Learn more about how you can help with the Project Browser Initiative.

Day One also included many other insightful sessions, Birds of a Feather discussions, and the First-Time Contributor Workshop. Alan Burke’s session, Having your cake and eating it too: Using Varnish to serve content from your new Drupal site alongside your Legacy platform - keeping 2 platforms live at the same time, walked audience members through running your own Varnish instance vs using a third party provider such as Fastly, what is achievable 'out of the box' using Fastly, and tricks to make sure Drupal works well in such a configuration.

Bringing Mautic and Drupal closer together in an open DXP with Dropsolid CEO Dominique de Cooman highlighted how Drupal and Mautic can form the backbone of an open DXP, specifically how a DXP can create value for the end user over using Drupal alone or Mautic alone.

Day Two

Day Two of the conference held two impressive keynotes, starting with KitKat and Jägermeister. These two powerhouse brands shared how they use Drupal to market their products, notably sharing that web traffic increased after KitKat implemented Drupal. Jägermeister showcased their solution for customized, collaborative, and transparent communication across borders with Drupal.

The second Keynote of the day, Fly Higher - How to Lead Fearlessly, brought Sarah Furness, a former combat helicopter pilot and Squadron leader, to the stage to give thoughtful and relatable tips on being the best leader you can be.

In Decoupling your search solution with Drupal Search API with speakers Jose Nieves and Christoph Breidert, we learned about how to use Drupal Search API with decoupled Javascript applications. We also saw an overview of the advantages and considerations when building a decoupled search application.

Other highlights from Day Two included Design in Figma, marketing automation, and a Drupal Association Public Board Meeting where new board members Piyush Poddar, Fei Lauren, Imre Gmelig Meijling, and Lenny Moskalyk were announced. Fei Lauren won the community-elected seat by securing the most votes during the At-Large Board Election!

Day Three

Finally, Day Three of DrupalCon Lille held the last keynote of the conference, where Drupal core initiative leads updated the audience on new improvements to the base system, event organization, diversity practices, and an update from Promote Drupal. This was the fifth installment of this keynote, and it allowed the audience to learn from key leaders in the community about what they are working on, their challenges, and how folks can get involved.

Innovation and the Future of Drupal was another topic on Day Three, hosted by the Drupal Association’s own Alex Moreno. Innovation in Drupal is a critical component of the Drupal Association and the Drupal Association Board regarding the vision for the future of Drupal. In this session, Alex led the conversation about the past, present, and most importantly, the future of Drupal. He was joined by a group of experienced tech leads in different areas in the Drupal industry: Scott Massey (Morpht), Cristina Chumillas (Lullabot), AmyJune Hineline (The Linux Foundation), and Nick Veenhof (Gitlab). During the discussion, Alex Moreno shared some numbers and graphs, the result of the work that he is doing on innovation. He shared that Drupal has still been growing strong in some areas of the industry, in particular in the top most popular 10k and 100k sites. We may simply need a little push to replicate the same for the rest:

At the end of the conversation, there was a positive message about the future of Drupal. In Alex's words, “We have the means, the experience, the opportunity, but most importantly, the community, to continue making Drupal a huge success for another 20 years. Let’s do it. There is nothing we cannot achieve together”.

ICT Greenhouse Gas Emissions Are Exploding – How Drupal Community Should Engage and Contribute Their Part with Janne Kalliola took us through why green coding is important, energy consumption in modern software, and how to reduce waste. Janne explained how information and communication technology accounts for 4-10% of the world’s energy consumption and 2.1-3.9% of greenhouse gas emissions. In this session, we learned that a sustainability team is being formed to help remedy this issue. Learn more here.

Finally, to wrap up three days of insightful sessions, the Closing Ceremony had everyone awaiting the much-anticipated announcement of the DrupalCon Europe location for 2024 … it will be held in Barcelona, Spain! We can’t wait to see everyone there.

Thank you for a successful DrupalCon Lille 2023!

Overall, DrupalCon Lille was a massive success with many informative and innovative sessions – too many to name in just one blog post! From the Birds of a Feather roundtables to Trivia Night, the community was able to learn and grow not only through all of the presentations and sessions but also through social events that helped connect our community. Thank you to everyone who made DrupalCon Lille a huge success, especially the Kuoni Kumlare team for organizing the event, and to our many sponsors and volunteers for making it possible!

See you all at the next DrupalCon in May 2024 in Portland, Oregon. 

Our community is better because you’re in it.

The news lately, both close to home and around the world can be a lot to manage for many people. This feeling of overwhelm and heartbreak is echoed throughout many professional communities, including Drupal. The Drupal community is a group that fosters connection and inclusion and as members of the Community Working Group, our mission is to support you, our community.

To that end, we’re releasing an updated list of mental health resources that are available to you and your peers. The majority of these sources are US-based but we’ve tried to include a few international resources as well. If you are looking for support networks in your country please reach out to any member of the Drupal Community Working Group and we will confidentially search our network to find resources that fit your needs.

American Psychological Association (APA) - Psychologist Locator:
Website: locator.apa.org

Crisis Text Line:
Text HOME to 741741 to connect with a crisis counselor
Website: crisistextline.org

Employee Assistance Programs (EAPs):
If you're employed, inquire about EAP services provided by your workplace.

Local Support Groups and Nonprofits:
Search for local mental health support groups or nonprofits in your area that may provide resources and support.

MentalHealth.gov:
Website: mentalhealth.gov

National Alliance on Mental Illness (NAMI):
Phone: 1-800-950-NAMI (6264)
Website: nami.org

National Institute of Mental Health (NIMH):
Website: nimh.nih.gov

National Suicide Prevention Lifeline:
Phone: 1-800-273-TALK (1-800-273-8255)
Website: suicidepreventionlifeline.org

Online Therapy Platforms:
Consider using online therapy platforms like BetterHelp, Talkspace, or 7 Cups for remote mental health support.

Open Sourcing Mental Health:
Website: OSMIHelp.org
A non-profit focused on mental health in the tech community with forums and resources available on the website.

Psychology Today - Find a Therapist:
Website: Psychologytoday.com

Substance Abuse and Mental Health Services Administration (SAMHSA) Helpline:
Phone: 1-800-662-HELP (1-800-662-4357)
Website: samhsa.gov

Therapist Directories (GoodTherapy, TherapyRoute, etc.):
GoodTherapy: goodtherapy.org
TherapyRoute: therapyroute.com

University Counseling Centers:
If you're a student, check if your university or college offers counseling services.

UK MIND:
Phone: 0300 304 7000
There is a list of other UK helplines available at
https://www.mind.org.uk
https://www.spuk.org.uk/national-suicide-prevention-helpline-uk/
 

Veterans Crisis Line:
Phone: 1-800-273-8255 (Press 1)
Text: 838255
Website: veteranscrisisline.net

Your Local Community Mental Health Centers and Hospitals:
Check your local directory or government health websites for nearby mental health clinics and hospitals.

We also want to encourage those impacted by the mental health struggles of others to reach out for help. You’ve been impacted - we see you and want to support you. 

None of us are alone - we are a community of peers, friends, and colleagues. 

No matter your relationship with mental health challenges or your role in the Drupal community - we’re all better because you’re on this journey with us. Please take care of yourselves. 

Sincerely, 
The Drupal Community Working Group