The previous articles covered Content — the menu for creating pages in Drupal — and Structure — the menu for configuration. Looking at how the two relate and walking through a concrete example starts to make Drupal's site-building rules visible.
Article Overview.
This article takes the Drupal rules introduced in the previous articles — pages are created in the Content menu, and the content types used for page creation are created and edited in Structure — and walks through them with a real example. The goal is to move past the general impression that everything page-related happens in one menu, and to understand that in Drupal, page creation belongs to Content and configuration belongs to Structure.
1. Creating a Page.
Let me walk through a page creation example. I'll use the article #L02 Lee 101Z 50's, written using the Life Style content type created in Structure > Content types.
1-1. Page Elements.
The page itself is fairly simple.
The page body contains the following elements:
- Title Lee 101z 50's
- Top image Black-and-white photo of jeans from behind
- Article body 1 Article on Lee 101z from Introdaction. through Example Photos.
- Sample image Full-body black-and-white photo
- Article body 2 Wrap-up from Ditails. onward
- Published: 2024-09-26 | Article creation date
- Author: S.Takeda | Article author
- Tag: Life Style | Term configured in Taxonomy
- Article category: Old-Clothes Articles. | Term configured in Taxonomy
- Breadcrumb Home / Life Style. / #L02 Lee 101Z 50's
And the overall page layout is:
- Header Site logo and title on the left Navigation menu on the right
- Article body as described above
- Footer Site name and Powered By Drupal
- Right side menu
The article body is framed by guides at the top, bottom, and right.
To build this page, the content type used for writing the article needs image fields, article body fields, and fields for tags, author, and date to be added.
Neither Olivero — Drupal's default theme — nor Bootstrap5, the theme used on this site, provides the fields needed for the page structure above in the default state of the Article or Basic page content types.
Understanding Drupal's rules in order to create pages with Drupal is what the articles up to this point have been about. As one example, if you want to add a tag element to a page, the process looks like this:
- You want articles to carry a tag element so they can be sorted on list pages later
- In Taxonomy, create the vocabulary that will serve as the tag, and create the necessary terms within it
- In Content types, add a tag field to the content type so the page element carries a tag
- Write the article using the content type that now has the tag field
That's the process required whenever a tag element is needed in an article. The key point: when a tag element is needed on a page — 1. configure the tag element in Taxonomy, 2. place the tag element on the page in Content types, 3. write the article using the content type where Taxonomy has been configured.
Understanding that configuration has to be done across multiple menus — and knowing where each setting lives — is what lets you create article pages with the elements you actually need, going beyond what the default content types provide.
Think of the content type used for writing articles in Drupal as a template — articles are created using that template. Configuring the Structure menu is what lets you create and set up that template. That's what this article is about.
1-2. The Page-Building Process.
Here's a summary of the process for writing and building the #L02 Lee 101Z 50's article as a page.
Content
Select a content type in the Content menu and write the article.
- In the Content menu, write an article about Lee 101z vintage jeans.
- Since it's a vintage clothing article, select the Life Style content type — set up specifically for vintage clothing articles — and write. Life Style already has the tag and image fields configured below.
Taxonomy
In Structure > Taxonomy, create vocabularies and terms.
- Create a vocabulary called Tags, and within it create a term called Life Style
- Create a vocabulary called Article category, and within it create a term called Old-Clothes Articles.
Content types
In Structure > Content types, configure fields for each element to be placed on the page.
- The Life Style content type is created in the Content types menu under Structure.
- In addition to the default fields, the following have been added and configured: 1. Image body, 2. Body 2, 3. Publication date, 4. Author, 5. Tags, 6. Article category.
Block layout
In Structure > Block layout, configure the display of the header, footer, side menu, and breadcrumb.
- In Block layout, hide the default breadcrumb and display it at the bottom of the page instead.
- In Block layout, select and display the side menu used for Life Style articles.
- The header is shared across all pages, so no configuration is needed here.
- The footer is shared across all pages, so no configuration is needed here.
Create the page > Content
Page creation is done in Content > Life Style article by entering the following.
Home > Administration > Content > Content > Life Style article
- Enter title | Existing field { #L02 Lee 101Z 50's }
- Insert top image | Existing field { Black-and-white photo from behind }
- Write article body 1 | Existing field { Article from Introdaction. through 4. History and Functional Beauty }
- Insert image in Image body | Added field { Full-body black-and-white photo at the center of the page }
- Write article body 2 in Body 2 | Added field { From 5. Ditails. to the end of the article }
- Insert publication date | Added field { Set date: 2024-09-26 }
- Insert author | Added field { Set author: S.Takeda }
- Select Life Style term for Tags | Added field { Set: Life Style }
- Select Old-Clothes Articles. term for Article category | { Set: Old-Clothes Articles. }
- Enter URL alias /lifestyle/fa002 | Existing field { Set the actual URL to use }
2. The Purpose of This Article.
That process is what produces the #L02 Lee 101Z 50's article page. The actual work isn't as tedious as this writeup makes it sound. I've spent three articles explaining it at length, but understanding how page creation works and grasping Drupal's rules is genuinely important — and I suspect failing to understand this is exactly why people who install Drupal end up giving up on it.
2-1. Understanding Drupal's Rules.
Creating pages in Drupal requires more than just the Content menu.
Unless you configure the Structure menu to match your site's goals, you can't break out of the default page layout and compose pages freely.
Once you understand it, it's not difficult. But I suspect many people who get interested in Drupal and go as far as installing it end up walking away without ever using it. I'm writing these articles in the hope that such people will stumble across this, realize what they were missing, and actually get to use the Drupal they went to the trouble of installing.
The template for creating a page is the content type. Creating that template and adding the necessary elements to it is done in Structure > Content types.
The building blocks are called fields. You add and configure fields — a tag field, an image field, and so on. Doing this adds the necessary elements to the template and lets you create pages with the structure you're aiming for.
Page creation < Select a content type = Page creation template < Provided by default | Bare minimum
Content type = Page creation template < Add necessary elements | Adding tags, image fields, etc.
Structure > Content types | Configured here
This is something you'll inevitably need when working with Drupal — essential knowledge for building the website you have in mind. And yet when I first installed Drupal, I couldn't find anywhere that explained it. After the install I eventually understood it by poking around the menus, but I think many people give up before reaching that point. That's why I wrote this article.
Conclude.
Writing this article, I found myself thinking back to a story about Henry Ford — founder of Ford — from a biography of great figures I read as a child. If I'm remembering it right: his mother was in critical condition, and he rushed to the hospital by horse-drawn carriage, but didn't make it in time and she passed away. In his grief, he thought that if only there had been something faster than a horse-drawn carriage, she might have been saved. That led him to want to rid the world of the kind of misfortune he'd just faced, and to the idea of building something faster than a carriage. That something was the automobile, and the company he founded to build it became the Ford we know today.
My articles have nothing directly to do with a great figure like Henry Ford. But I wrote them thinking that other people must be running into the same problems I ran into myself — and hoping that if someone facing the same issue comes across this, it might help them solve it even a little. It's not quite volunteering, but I'm using Drupal as open-source software, and so I want to carry the spirit of mutual help that lies at the heart of open source. Clumsy and modest as my contribution is, I hope that sharing the things I ran into and managed to work through can be of some small use to others — and that Drupal spreads in a good way.
It's a long and not particularly easy read, but I'd be glad if it gives someone who found their way here the opening they needed to actually use Drupal.
At the end, here's a summary of the Life Style content type field structure and the block layout configuration.
Content Type: Life Style — Field Structure.
Default article page before adding fields
|-- Content type / Article
| |
| |-- Title / Default field
| |-- Image / Default field
| |-- Body / Default field
| |-- Tags / Added field { Configured in Structure > Content types } |
|-- Taxonomy
| |-- Vocabulary / Tags { Configured in Structure > Taxonomy }
| |-- Term / None configured
The Life Style page created
|-- Content type / Life Style
| |
| |-- Title / Default field
| |-- Image / Default field
| |-- Body 1 / Default field
| |-- Image body / Added field { Configured in Structure > Content types }
| |-- Body 2 / Added field { Configured in Structure > Content types }
| |-- Publication date / Added field { Configured in Structure > Content types }
| |-- Author / Added field { Configured in Structure > Content types }
| |-- Tags / Added field { Configured in Structure > Content types }
| |-- Article category / Added field { Configured in Structure > Content types }
|
|-- Taxonomy additions
|-- Vocabulary / Tags { Configured in Structure > Taxonomy }
| |-- Term / Life Style { Configured in Structure > Taxonomy }
|
|-- Vocabulary / Article category { Configured in Structure > Taxonomy }
| |-- Term / Old-Clothes Articles. { Configured in Structure > Taxonomy }
Block Layout Configuration
Block layout
|-- Header
| None
|-- Navigation branding region
| |-- Site title
|-- Main navigation region Additional navigation region
| |-- Menu
|-- Breadcrumb
| None { Configured in Structure > Block layout }
|
|- Sidebar First
| None
|
|-- Main content
| |-- Messages / Default
| |-- Page title / Default
| |-- Tabs / Default
| |-- Help / Default
| |-- Primary admin actions / Default
| |-- Main page content / Default
| |-- Breadcrumb / Added block { Configured in Structure > Block layout }
|
|- Sidebar Second
| |-- Sidebar01 / Added block { Configured in Structure > Block layout }
|
|- Footer
| |-- Footer01 / Added block { Configured in Structure > Block layout }
I set out to explain the basic concepts of Drupal using page creation as a concrete example, and ended up with three articles that aren't the easiest read. The Structure menu for Drupal configuration is highly flexible and offers a great deal of freedom — and going forward I plan to write articles that build on those advantages to construct a website. I'm also taking away from this exercise the challenge of finding a way to write more concisely and clearly, and that's something I want to keep working on.
A Summary of Drupal Page Creation.
The basic Drupal concepts needed for page creation ended up spanning several articles and getting hard to follow, so here's a summary to pull it all together.