Drupal CMS with Lupus Decoupled

Drupal CMS is Drupal's user-friendly distribution aimed at marketers and content teams. Lupus Decoupled supports it via site templates, providing a fully decoupled setup out of the box.

The Lupus Decoupled Starter is a ready-to-use Drupal CMS site template that bundles:

• Drupal CMS base setup: content types, editorial workflow, and other Drupal CMS defaults
• Lupus Decoupled Recipe: core modules and configuration
• Lupus Decoupled Canvas: Canvas visual editor integration
• Lupus CSR: client-side rendering theme with the Nuxt Starter (set as default)

Installation

Install the starter as a site template when setting up Drupal CMS, or apply it manually:

composer require drupal/lupus_decoupled_starter
drush site-install ../recipes/lupus_decoupled_starter

For a full local setup with DDEV:

mkdir my-drupal-site && cd my-drupal-site
ddev config --project-type=drupal11 --docroot=web
ddev composer create-project drupal/cms
ddev composer require drupal/lupus_decoupled_starter
drush site-install ../recipes/lupus_decoupled_starter
ddev launch

First Steps

After installation, navigate to Content > Pages in the Drupal admin to find the provided demo content. Open a page, review it, and try editing it with the Canvas visual page builder to get familiar with the setup.

Client-Side Rendering (CSR)

The starter uses Lupus CSR (Client-Side Rendering) as the default theme. This means:

• The frontend is pre-built and served directly from Drupal, with no separate frontend server needed
• The frontend JavaScript runs in the browser and fetches content from the CE API at /ce-api/... on the same origin, so no CORS configuration is required
• This is ideal for getting started quickly, but not recommended for SEO-critical production sites (use SSR instead)

All Lupus Decoupled documentation applies regardless of whether you use CSR or SSR. For Nuxt rendering mode details, see Rendering modes.

Customizing the Theme

To customize the frontend, run a local frontend dev server and point Drupal to it during development:

• Go to Configuration → Lupus Decoupled Settings (/admin/config/services/lupus-decoupled)
• Set Frontend base URL to your dev server and enable frontend redirects

Pages and Canvas previews now render via the dev server. When adding new Canvas components or changing their props, go to Administration > Appearance > Components > External JS (/admin/appearance/component/extjs) and press Update components.

Provide an Updated Lupus CSR Theme

Once customization is done, generate a production build of your frontend and configure Lupus CSR to serve it via /admin/appearance/settings/lupus_csr. For sub-theme packaging, see Creating a Sub-Theme.

For detailed instructions for the Nuxt-based default theme, see CUSTOMIZING.md.

Switching to Server-Side Rendering

To move from CSR to SSR:

1. Set up a separate frontend server
2. Configure the Lupus Decoupled frontend URL to point to your frontend server and enable the frontend redirect

Refer to Deployment strategies for options.

Creating New Site Templates

The Lupus Decoupled Starter is designed to serve as a template for building new Drupal CMS site templates. See the Site Templates page for guidance.