Welcome to Drupal

by Chris Albrecht

Drupal 8 is here! And with all the new bells and whistles that the community built into the administrative experience, it’s simpler than ever to get your site up and running. If you’ve worked with Drupal before, you’re probably familiar with terms like “node” and “theme,” and you may have even installed Views to generate blocks of content to drop into regions in your page template. However, if you are new to Drupal, these words may seem more appropriate in a video game than in your website. You’ve come to the right place! Allow me to show you around and introduce you to Drupal.

If you’d like to follow along at home you’ll need to have a working Drupal 8 site up and running, though it's not required to continue though this article. The easiest way to get a Drupal site up and running is to sign up for a service like Pantheon or download Acquia’s Dev Desktop. If you’re more of a do-it-yourself-er, you’ll first need to setup a local environment. There is documentation on Drupal.org for just about any system you might be running. Then you’ll need to install Drupal 8. You can follow the steps in Drupal’s install.txt file, or try this tutorial written by Hui Jing.

The Basics

Before we start pushing buttons and twisting knobs, let’s go over some basic terminology. I listed the terms we'll talk about in a glossary at the bottom of the page for an additional reference.

When you download Drupal, you are downloading a set of files called Drupal core. These files make up everything Drupal needs to function. Inside there are modules, which extend Drupal’s functionality, and themes, which provide the front-end structure, layout and design. Drupal core comes with some modules that are required, others that you can enable if you like, and there are a plethora of modules created by the community on Drupal.org that you can install separately to add functionality to your site. Just like modules, Drupal ships with some themes you can use right out of the box, or you can download and install one from the community. Some themes are designed to be used right away with just a little configuration. Others are known as base themes, which provide some basic structure and are intended to be used as a starting point to create your custom theme. For example, you can choose Bartik or Seven and have a good looking and functional site right away. In fact, Seven is the theme that is used for administrative pages. Classy and Stable are two base themes in Drupal core that you can use to start building out your own theme. Check out Marc Drummond's article "A Tale of Two Base Themes in Drupal Core" to learn more about these awesome tools.

Now that we know the basics, let’s take a look at what Drupal does.

Creating Content

Every website has different requirements, but most commonly the goal is to create content that you can deliver to your visitors. In Drupal we do this by using the administrative tools to create a content type, for example Event. We then add fields to it such as Date and Location. Now we can create pieces of content, commonly referred to as nodes, of the type Event. When we add a new event, Drupal will automatically create a URL to view it and will display it in a nice format. In the simplest form that's all we need! We can create events and give people URLs where they can view them.

Admin screen to manage content types.

If you are playing along at home, this is a good place to try things out for yourself. See if you can complete the following steps:

  1. Create a new content type. Call it whatever you like.
  2. Add two fields to the content type.
  3. Create a new piece of content of this type.
  4. Visit the URL that Drupal provides to view it.
Example event node.

Defining content types and adding the necessary fields to them is the basis for getting content into Drupal, but what if we want to change the way it is presented on the screen? Luckily, Drupal also makes it very easy for us to change the order in which the fields appear, their formatting, their labels and even whether they should be displayed at all.

Customizing the Display

When you are adding fields to a content type you'll notice a tab labeled Manage Display. On this tab you can drag your fields up and down to reorder them, hide or show the labels and many more options depending on the fields you created. Just above the field table you’ll notice a secondary set of tabs with the option of Default selected. These are view modes. The most common way of viewing content is by visiting its url, but there are times we want to display a piece of content in a different format, for example, as a teaser in a list of recent posts. View modes let us change the way a node is displayed. If we don’t choose a specific view mode, the Default view mode is selected. A couple of common view modes are provided out of the box and can be found under Custom Display Settings at the bottom of the Manage Display page. We can also define different view modes for different purposes by going to Structure > Display Modes > View Modes through the toolbar. For the content we’ve created so far, Drupal will use the Default view mode when we visit that node’s URL. We'll talk more about ways to use view modes later. Next, let's talk about how to create custom pages that are not just pieces of content, such as an events list, blog roll, or your homepage.

Admin screen to manage field display.

So far Drupal has been providing URLs for the content we created. Somewhere in our website, however, we’ll likely want pages that show not just a single piece of content but collections of many pieces content. Maybe we want to list all of our upcoming events on the homepage. There are many modules that can help us create and manage custom pages, but installing new modules is slightly out of scope for this article. Luckily, Drupal comes with a module will take us pretty far called Views.

Custom Lists of Content

The Views module lets us define filters and sorting mechanisms to create lists of content. It calls these lists views. The Views module also allows us to display that content in a variety of formats. For example, if we want a list of the 5 most recent blog posts or the next upcoming event, we can create a view to get that content and format it for us. Let’s continue with events as an example.

Admin screen to create a new view.

When we create a new view from the admin interface, we give it basic information about what we want, such as the type of content we are looking for and how to sort it. Next we create different displays of that view. We could create a Block display to show the next upcoming event, and a Page display to show all upcoming events. Views will even link them together for us.

Admin screen to manage a view.

If you are playing along at home, this is a good place to try things out for yourself. See if you can complete the following steps:

  1. Add a new view and limit it to the content type you created earlier.
  2. Enable the Page and Block options, then Save and Edit.
  3. Visit the URL for the page you created to view it.
List of upcoming events.

There are many ways to configure a view, but for now you have the basics. One last piece that we haven’t talked about yet are blocks. Blocks are small chunks of content that don’t deserve their own page, but more likely live in a separate region like a sidebar or footer. Let’s add a block to one of our pages.

Working with Blocks

Opening the blocks UI from the admin toolbar, you’ll see a list of regions with a button to Place Blocks. These regions are defined in the current theme. If you enable a new theme or create one yourself, the regions will likely change. Use the Place Blocks button to choose a block from the available list and put it into a region. If you created a view in the last section, you should see your view block in the list! Each block can be configured to only show on certain pages, to certain users, etc. After adding your block to a region, use the button at the bottom to save your changes, and you should now see your new block in whichever region you added it.

Admin screen to place blocks.

Now you have all the tools necessary to start building your website in Drupal 8. You can create content types, add fields to them, change the way they are displayed, create lists of content with Views and place blocks into your layout. There’s a lot more that Drupal can do, and the best way to learn is by trying. Now that you have a grasp on the basics, explore some of the other fields and settings in the content types, views and blocks. On behalf of the Drupal community, welcome!

Glossary

These are some of the terms I referenced. There is a more complete glossary at https://www.drupal.org/glossary.

Base Theme
A Base theme is a well-written set of CSS and template files that a theme developer can make use of in a new custom theme. Theme developers can make sub themes to override the default base theme. Some of the popular base themes include Zen, Omega and AdaptiveTheme.
Block
The boxes visible in the regions of a Drupal website. Most blocks (e.g. recent forum topics) are generated on-the-fly by various Drupal modules, but they can be created in the “administer blocks” area of a Drupal site.
Drupal Core
The files and modules included with the Drupal project download.
Module
Software (usually PHP and CSS) that extends Drupal features and functionality. Drupal distinguishes between “core” and “contributed” modules.
Content Type
Every node belongs to a single “node type” or “content type”, which defines various default settings for nodes of that type, such as whether the node is published automatically and whether comments are permitted. Common "Content Types" that just about any website would have include: blog post and page. Content types can have different fields and modules can define their own content types. The core Drupal Book and Poll modules are two examples of modules that define content types.
Field
Elements of data that can be attached to a node or other Drupal entities. Fields commonly contain text, image, or terms.
Node
A piece of content in Drupal, typically corresponding to a single page on the site, that has a title, an optional body, and perhaps additional fields. Every node also belongs to a particular content type, and can additionally be classified using the taxonomy system. Examples of nodes are polls, stories, book pages and images.
Region
Defined areas of a page where content can be placed. Basic regions include: Header, Footer, Content, Left sidebar, Right Sidebar. Different themes can define different regions so the options are often different per-site. Content is assigned to regions via blocks. They can be ordered by weight within regions to define the order in which they display.
Theme
A file or collection of files (PHP, INFO, CSS, JPG, GIF, PNG), which together determine the look and feel of a site. A theme contains elements such as the header, icons, block layout, etc. Drupal modules define themeable functions which can be overridden by the theme file. There are additional themes available in the themes section of downloads.
View Mode
A view mode is way to customize how an entity is rendered. Examples are 'Full Page', 'Teaser' or 'JSON'. In Drupal 8 this is located under Structure > Display Modes.
Views
A module which allows site developers a graphical interface for creating lists of various Drupal entities; most notably users and nodes. Views permits selection of specific fields to display, filtration against various attributes, choice of basic layout options (i.e. list, full entities, teasers, etc.), and other more advanced features. Many Drupal sites use Views extensively. In Drupal 8, the Views module is part of Drupal Core.
View
In reference to the Views module above, a view is what is created when the site builder adds or creates a new view from the interface. Each view uses a table in the database as a "base table" to build a list of objects. The view by itself is an abstract wrapper of instruction that are inherited by each view display created within the view.
View Display
In reference to the Views module above, view displays are created inside of a view to display the objects fetched by the view in different manners. For example, a view called "Blog Posts" might have view displays for "Top 5", "Most Recent", or "Posts by Author".
newsletter-bot