Skip to content
W3S101

Drupal - Static Pages

Drupal - Creating Basic Pages (Static Content)

Section titled “Drupal - Creating Basic Pages (Static Content)”

In Drupal, what are often referred to as ‘static pages’ are typically created using the ‘Basic page’ content type. This content type is ideal for content that doesn’t change frequently, such as an ‘About Us’ page, ‘Services’ page, or ‘Contact Information’. While Drupal is a dynamic CMS, these pages can be heavily cached to serve quickly, mimicking the speed of truly static HTML files for anonymous users.

Let’s walk through creating a ‘Basic page’ in Drupal.

Steps to Create a Basic Page

Section titled “Steps to Create a Basic Page”

Step 1: Navigate to Content Creation

In the Drupal administration menu, click on ‘Content’.

Then, click the ’+ Add content’ button.

Description: From the main admin navigation, select ‘Content’ which usually takes you to /admin/content. On this page, find and click the ’+ Add content’ button.

Step 2: Choose the ‘Basic page’ Content Type

You will see a list of available content types. Click on ‘Basic page’.

Description: Drupal provides a list like ‘Article’ and ‘Basic page’. Select ‘Basic page’ to proceed.

Step 3: Fill in the Page Details

A form will appear for creating your new basic page. Here are the key fields:

  • Title: Enter the title of your page (e.g., ‘About Our Company’, ‘Our Services’). This will often be used as the main heading (H1) of the page.
  • Body: This is the main content area. Use the rich text editor (CKEditor 5 by default in modern Drupal) to add text, images, links, and other content. You can switch text formats (e.g., ‘Basic HTML’, ‘Restricted HTML’, ‘Full HTML’) depending on your permissions and the type of content you need to add.
  • URL alias (under URL path settings): Drupal automatically generates a URL like /node/123. It’s highly recommended to set a user-friendly alias (e.g., /about-us, /our-services). Ensure you don’t add a leading or trailing slash in the alias field itself (e.g., enter about-us, not /about-us/). The Pathauto module (a very common contributed module) can automate alias generation based on patterns.
  • Menu settings (optional): If you want to add a link to this page in one of your site’s menus (e.g., the main navigation), you can check ‘Provide a menu link’, enter the ‘Menu link title’, and select the ‘Parent item’.
  • Publishing options: By default, new content is ‘Published’. You can uncheck this to save it as a draft. You might also have options like ‘Promoted to front page’ or ‘Sticky at top of lists’.

Example for an ‘About Us’ page:

  • Title: About Our Company
  • Body: [Detailed information about the company's history, mission, and values.]
  • URL alias: about-our-company

Step 4: Save the Page

Once you have filled in all the necessary information, click the ‘Save’ button at the bottom of the form.

Description: After saving, you will typically be redirected to view the newly created page on the front-end of your site.

Viewing Your New Pages

Section titled “Viewing Your New Pages”

After saving, you can navigate to the URL alias you set (e.g., your-site.com/about-our-company) or find the page in the content list at ‘Content’ (/admin/content). If you added a menu link, it should appear in the designated menu.

True Static Site Generation (Advanced)

Section titled “True Static Site Generation (Advanced)”

For scenarios requiring true static HTML files (e.g., for extreme performance, security, or deployment on simple hosting), Drupal can be used as a Static Site Generator (SSG) with tools like:

  • Tome: A module that allows you to generate a fully static HTML version of your Drupal site.
  • Decoupled Approach: Using Drupal as a headless CMS and a separate static site generator (e.g., Gatsby, Next.js, Hugo) to fetch content via API and build static files.

However, for most common use cases, Drupal’s internal caching and the ‘Basic page’ content type are sufficient for creating fast-loading ‘static-like’ pages.

Additional Resources: