Creating and Editing Content in Drupal
Drupal sites are all about content. In order for the site to present content to the visitor, it needs to contain content. How does content get into the Drupal site? In this article, you will learn how to work with content, create it and edit it. So, let’s get started!
Using the WYSIWYG editor
When you send a text message from your phone, you type the text, and that’s pretty much all there is to it in terms of the content’s appearance. You’re limited to choosing whether you want to use capital letters. If you want more control over your message, you can switch to sending an email message, which might enable you to select bold, italic, or underlined text.
If you want to send highly formatted content, text with headings, font changes, text color, bulleted lists, and so forth, you might use word processing software, such as Word, Pages, or LibreOffice.
This class of software creates what is called rich text, that is, text rich in styling, and the generic term for software capable of creating a document containing rich text is a rich text editor.
Drupal 8 includes a rich text editor called CKEditor. It is a highly configurable editor with a composition area, as shown in the following screenshot, that resembles standalone word processors with formatting buttons. This type of editor is referred to as WYSIWYG, which is pronounced as wizzy-wig, which stands for What You See Is What You Get, meaning that the text it displays shows the selected formatting:
Let’s create a
piece of content and reproduce what is in the image. Click on
Content in the admin menu, then click on
+Add content button.
When you are presented with the list of content types, click
The page contains all the fields and settings necessary for creating Article content. Those fields that require an entry have an asterisk following their name, and I will also include an asterisk as we address each of the fields, in turn.
The Title is a required field for all content because it is used to identify one piece of content as distinct from another, though it does not have to be unique, and so more than one piece of content can have the same title, which quickly becomes confusing. The entry in this field will appear in the summary admin list of content. It is also used as the page title when the content is read on its own page. Therefore, it is best to enter a title that is both meaningful to you and informative to the site visitor. Enter one now. Mine will be A Moment in the Life of My Dog.
You might be wondering why the Body field is not required since the article would be somewhat useless without body text. It is because you might want to create the article as a draft and return later to actually create the body text. This is not possible with the title, because without one, it would be difficult to find the article.
Next to the field
name is a link that reads
Edit Summary. When creating a content type, the
creator decides whether the body text field should accommodate having a
separate summary and if so, that link is
shown. The summary is used, for example, when providing a list of content for
the site visitor, where a short description of the content—a teaser—is provided.
There are two ways to provide the teaser text: via a separate summary or by trimming, that is, excerpting text from the start of the content. I prefer to use the summary because trimmings are based on a set number of characters that is the same for all of the same type of content, such as the first 40 characters, so I have no control over where the excerpt will end… maybe it will end in the middle of a word. With a summary, I can precisely control what will be shown. Even if it is identical to the start of my body text, I am able to ensure that it ends in an appropriate place.
Click on the
Edit Summary link. A Summary text box will
appear above that for the body. It contains a link to hide the field
again. This toggle of Edit summary/Hide summary allows you to remove its
distraction until you need to use it. You will notice that the bottom right corner
of the text box has a widget that’s meant to resemble page corners that can be
grabbed with the mouse and dragged to enlarge or reduce the size of the text
box. It also has a note below it letting you know that if you do not enter
summary text into the field, Drupal will use a trimmed version of the body text
as a summary. Enter some summary text into the field. Mine will read: Sasha makes an exciting
Body field goes the full text of the
article. Depending on the text format selected, various buttons are
available from the editor for formatting the text. My text looks as follows:
Today Sasha Gabor discovered donuts! They’re not exactly healthy diet fare for a dog, but she didn’t seem to mind.
Enter some text for your article, and format some of it using the B (bold) or I (italic) buttons. When you have entered it, click the
Source button to see what the actual HTML markup looks like. Mine shall look like this:
<p>Today Sasha Gabor discovered <strong>donuts</strong>! They're not <em>exactly</em> healthy diet fare for a dog, but she didn't seem to mind.</p>
If you ever need
to customize the underlying HTML of the body text, this is where you can do it.
Source button again to return to the WYSIWYG mode.
Text format dropdown is used for selecting the
filter that will be used when entering text. Security is a constant
concern on websites that accept entry from users, as some bad actors will
attempt to enter markup that can cause havoc. Filtering which type of markup is
allowed helps to mitigate the potential for trouble.
These filters can be defined and configured, and the configuration will, for example, identify which HTML tags will be allowed and which processes will be run (such as HTML correction) and in which order. Filters are assigned to user roles, and a user role can have access to more than one filter. The filters that are included with Drupal and their default configurations are as follows:
- Plain text: No HTML tags will be accepted
- Restricted HTML: A minimal set of HTML such as italics, bold, and headings are typically used for anonymous users (users who are not logged in)
- Basic HTML: Similar to Restricted HTML, but usually inclusive of a configuration for WYSISYG toolbar buttons, since the filter is normally used for authenticated (logged in) users who will have access to the editor
- Full HTML: Allows any valid HTML tag, and should be assigned with care
This filter will not be included in the dropdown as it is used when no other filters are available.
Tags field is used to include terms
related to the content. These terms can be used by users to search for content.
Multiple terms should be separated by commas. The field is an auto-complete
field, meaning that any existing terms matching the characters typed
will be offered for you to click rather than typing the entire term. My tags
will be Sasha and donuts.
Image field enables choosing a
file from the device you are using and uploading it to be stored and associated
with the content. The maximum size of the file is given below the field
(typically 2 MB) and so are the file types that will be accepted. I’m going to
add an image and enter Sasha and her donut as alt text. Alt text is used to provide
information about the image to those users using a screen reader or some other
form of access rather than viewing the image.
Publishing the content
Published checkbox sets the content’s status
to be either draft (unchecked) or published (checked). Typically,
only editors, admins, and the content’s author will be allowed to view the
content when in its draft state. The content will not appear in menus or lists
to those roles that don’t have permission to view it. Let’s check the box to
publish our content.
That covers the main fields used to create Article content. There are additional configuration options available via the vertical tabs. Let’s take a look at those:
These additional settings are referred to as metadata, which is information used to describe the content that is not actually part of the content.
Revision log message
If the content type that you are working with is set for revisions, you can enter a description of the changes you have made to the content in this box, and that description will be saved and listed when reviewing the available revisions for this content.
Should you want a menu link for this content, checking this box will open a dialog for providing the following settings:
Menu link title: The text that appears as a link
Description: The text shown when the mouse hovers over the link
Parent item: The menu link under which this one will be indented
Weight: A value which determines the position of this menu item in relation to any others (based on their weights) with the same parent
If your content type is set to allow comments, you can set this particular piece of content to accept comments (open) or not (or no longer) accept comments (closed).
URL Path Settings
When a new piece
of content is created, it is assigned a sequential numeric ID known
as the node ID or NID. By default, the
URL displayed when the content is presented, similar to
http://mysite.com/node/123, where 123 is the NID. If you want your
content to have a more meaningful URL than node/123, such as sasha-discovers-donuts, that custom URL, known
as an alias, can be defined here.
If you are creating content on behalf of another user, you can begin typing their username in the text box in this tab and choose the name from the presented matches, as well as specify the date that should be considered the content creation date.
Content can be “promoted” to a higher status for the purposes of including it on the home page or even featuring it there.
Promoted to front page: Some sites determine what content is displayed on the front page by selecting only that content that has been promoted.
Sticky at top of lists: If the content is Sticky, it will stay on the homepage while other content is replaced with newer content. This is a good way to have a welcome message remain while other content is cycled.
Completing the process
At this point, we
are ready to save our new content by clicking on the
Save button. After doing so, the content
is displayed for you to see. Note the URL that is shown. In my case, it
is node/2. I would rather have something more meaningful for the user and for good
SEO, so I will click the
Edit tab and navigate to the vertical tab
URL PATH SETTINGS. There, I will enter
/sasha-discovers-donuts (the initial slash is required) and
save the article again. Now, the browser will show my improved URL. I can still
use the original URL of node/2. It has not been removed. Create a better URL
for your content in the same way.
You will notice
that one of the tabs above your article reads
Revisions. Click on it. Because the Article content
type is configured to create revisions when saved, and we did not override that
by unchecking the
Create new revision checkbox, the change we made and saved in
order to improve our URL resulted in the change being saved as a new version
rather than simply overwriting the original one. In this manner, we could
create a new revision every time we edit the content.
From this Revisions page, we can do the following:
- View a list of the previous versions
- View a previous version
- Delete a previous version
- Revert to (restore) an earlier version, foregoing the changes made since
If you found this article interesting, you can explore Drupal 8 Quick Start Guide for your step by step guide with easy to follow instructions for navigating Drupal 8. Drupal 8 Quick Start Guide will clear your path from installation to a building usable site in minutes, and to a customized site in one sitting.