Drupal CMS v1: Installation and Demo

Don’t forget to subscribe to our YouTube channel to stay up-to-date.

In the above livestream, we will demonstrate Drupal CMS v1. You will learn how to install it using DDEV, and we will examine some of its new features, focusing on AI and workflows using the ECA module.

Installing Drupal CMS using DDEV

There are two ways to install Drupal CMS: download it using Composer and run it on your stack, or download a packaged version and use DDEV.

Run the following command to download it using Composer:

composer create-project drupal/cms

Go to the Drupal CMS page and download the latest version:

NOTE: Make sure you have DDEV installed and working

Installation using DDEV

1. Download the Drupal CMS ZIP file

2. Open your terminal and run ./launch-drupal-cms.sh

3. Once installed, you should see the installation page

Essential DDEV commands

Below are some useful DDEV commands to help you manage your Drupal instance:

• ddev start: Launch your environment
• ddev stop: Shut down containers
• ddev status: Check environment status
• ddev drush: Run Drush commands
• ddev composer: Manage dependencies
• ddev ssh: Access shell
• ddev mysql: Database operations
• ddev drush uli: Quick user login

Drupal CMS Installation

Drupal CMS has a new installation wizard.

At the “Getting started” step, you can select what pre-configured types of content you want on your website. This will go ahead and install the required Drupal recipe.

Then you enter your site name.

Create a user account and click on finish.

Once the installation is complete, you’ll be redirected to the new Drupal CMS dashboard.

Drupal CMS Features

Drupal CMS is a ready-to-use platform for content creators, and it comes with modules pre-installed out of the box. It offers media functionality, analytics, search capabilities, automatic updates, AI integration, and more.

Below are some of the features that we covered.

Backend Theme

The backend uses the Gin theme by default for an improved user interface. The navigation is positioned on the left side.

Create Basic Page

Creating content is easy because Drupal CMS supports several content types and is pre-configured with workflows, path aliases, and scheduling.

Trash Functionality

Drupal CMS includes the Trash module, which offers trash functionality that prevents permanent deletion. Content can be restored from the trash.

Coffee

The Coffee module comes pre-installed and configured. It provides Spotlight-style functionality that allows you to jump between pages in the back end. Click “Go To” in the top right corner to do so.

Workflow

Drupal CMS includes workflow capabilities featuring drafts, published, and unpublished content transitions.

Dashboards

The CMS features a dashboard with editable sections to display desired content.

Media Management

The Media and Media Library modules are installed and configured by default. Drupal CMS comes with advanced media functionality out of the box.

Project Browser/Recipes

The Drupal Starshot Initiative developed two important features for managing modules and recipes.

Project Browser

Drupal CMS now uses a project browser for easy installation and managing of projects. This functionality simplifies the process of installing modules with a simple click.

Recipes

Drupal CMS includes recipes, which enable the addition of functionality through configuration.

Drupal AI (Artificial Intelligence) Integration

Drupal CMS ships the Drupal AI modules out-of-the-box.

Drupal CMS has a recipe for setting up an AI Assistant for you. All that’s required is an API key for OpenAI or Anthropic.

Below are the steps to configure an AI assistant with a chatbot.

Install AI Modules and OpenAI API Key

Go to Extend and install the following modules:

• AI Agents Explorer
• AI Agents Extra
• AI Agents Form Integration
• AI Chatbot
• OpenAI Provider

The dependencies on the modules will handle installing all the other required AI modules.

Add OpenAI Key

Note: You must create an OpenAI API key to use the AI assistant. Go to the Developer quickstart page to learn how to make a key.

Go to Configuration, AI, “AI providers” and click on “OpenAI Authentication”

Click on “Create new key” and add the OpenAI key.

You’ll be redirected to the keys module to add the API key.

Do not forget to return to the “OpenAI Authentication” page and select the OpenAI key you created from the drop-down. This step can easily be overlooked.

Create AI Assistants

We need to create an AI assistant.

Go to Configuration, AI, “AI providers”, “AI Assistant” and click on “Add AI Assistant”.

Give the assistant a name.

Scroll down to “Agent actions” and enable the agents you want to use.

AI Default Settings

Go to Configuration, AI, “AI providers”, “AI Settings” to configure provider options.

From this page you can control default providers for audio to audio, image to video, text to image, embedding, moderation, chat and more.

AI Agents Settings

You can change the settings and test the AI agents individually by going to the “AI Agents Settings” page.

When editing the AI agent, you can control usage instructions, define which roles can use the AI agent, and configure prompts and plugin settings.

If you click on Explore, you can manually run prompts. This is a great way to debug and test AI agents.

Display Chatbot via Blocks

We need to add a block to a theme region to display the chatbot.

Go to Structure, Block Layout, and add the “AI DeepChat Chatbot” into a theme region.

NOTE: If you want the chatbot to appear only on the front-end, add it to your front-end theme. If you want it to appear only on the back-end theme, add it to the Gin theme.

Select the created AI assistant, adjust the block settings and click on save block.

You should now see a working chatbot in the bottom right.

Prompt used to Create Content Type

Here is the following prompt that was used to create the content types in the video.

Can you please create a course system in Drupal, which will consist of a course content type, a lesson content type, and also a course category taxonomy vocabulary?

Create a "Course category", Taxonomy Vocabulary, with the following options or tags.
- Drupal
- WordPress
- Typo3

Create a "Course" content type with the following fields:
- Label: "Title"
- Label: "Description", machine_name:"field_course_description", field_type: Text (formatted, long)
- Label: "Course category", machine_name:"field_course_category", field_type: Entity reference, reference type: Taxonomy term, Vocabulary: Course Category

Create a "Lesson" content type with the following fields:
- Label: "Title"
- Label: "Description", machine_name:"field_lesson_description", field_type: Text (formatted, long)
- Label: "Course", machine_name:"field_course", field_type: Entity reference, reference type: Content, Media type: Course
- Label: "Video", machine_name:"field_lesson_video", field_type: Entity reference, reference type: Media, Media type: Remote video

Please go ahead and create the taxonomy vocabulary, content types, and fields in Drupal.

Debug Agent Decisions

If the chatbot and our agents aren’t returning things exactly the way you expect, you can debug the agent decisions by going to the Content page and clicking on “Agent Decisions” tab.

You can edit each log to see which prompt was used, what question was asked, and review both the response given and detailed output. This is a great way to debug issues.

ECA: Event – Condition – Action

ECA (Event – Condition – Action) comes installed on Drupal CMS. It offers functionality such as duplicate content, authentication redirects, user registration, and more.

You can view all the models by navigating to Configuration, selecting Workflow, and clicking on ECA.

What is ECA: Event – Condition – Action

ECA is a robust, no-code Drupal solution that serves as a rules engine, enabling users to automate and manage their Drupal site’s functionality through event-condition-action models.

The system includes numerous sub-modules that enhance its capabilities, providing options for content management, form handling, user access control, and workflow automation. Furthermore, it stores models in an easily imported and exported configuration.

What makes ECA especially valuable is its flexibility and user-friendly design. It requires only Drupal Core as a dependency while offering extensive customization options through its expanding ecosystem of plugins and integrations.

Install AI ECA module

To integrate AI functionality into ECA, enable the AI ECA integration sub-module.

Generate list summary using AI and ECA

Let’s explore using ECA and AI to generate a list summary of content when saved. This involves establishing a condition, performing an action to retrieve the field content, utilizing AI to summarize, and then updating a field with the summary.

Add List summary field to content type

Add a text (formatted, long) field called List Summary to a content type.

Create ECA model to summarize content

1. Click on “Add new model” to start building the model.

2. Add the “Presave content entity” event”.

3. Add the “Entity: field value is empty” condition.

4. Add the “Entity: get field value” action.

5. Add the “Chat” action.

6. Add the “Entity: set field value” action.

If the list summary field is empty, ECA retrieves the content from the body field, passes it to OpenAI to generate a summary, and saves it back to the list summary field.

AI and CKEditor

The AI module can be integrated directly into CKEditor using the AI CKEditor sub-module.

This will allow you to generate content directly from CKEditor, summarize, fix, and translate content, and much more.

Install AI CKEditor integration sub-module

Ensure you set up the AI module with provider keys and install the AI code editor integration sub-module.

Add AI Button to CKEditor

1. Go to Configuration, “Text Formats and Editors” and configure a text format with CKEditor 5.

2. Add the AI CKEditor button to the active toolbar.

3. Click on “AI Tools” and enable specific functionality.

4. Navigate to CKEditor, and you should see an “AI Assistant” button with dropdown options for the enabled AI tools.

Summary

Drupal CMS version 1 represents a significant step forward as an initial packaged, out-of-the-box Drupal solution.

It comes pre-installed with numerous contributed modules, providing users immediate access to media management and allowing project downloads directly from the browser. It offers robust AI functionality that can be implemented using ECA and AI capabilities that can be integrated into CKEditor.

If you’re searching for a powerful out-of-the-box solution for Drupal, consider Drupal CMS.