Advanced Content Management with the Paragraphs Module in Drupal

18 Mar 2024

Creating user-friendly and stylish web pages can sometimes make you nervous, and maybe you want to turn off your computer - does that sound familiar? Even using popular CMSs, including Drupal, sometimes it is difficult to understand this issue and create a functional, modern website. Drupal can offer several effective solutions, and today, we will look at one of them - the Drupal Paragraphs module.
Creating a home page, or even a regular page on a website, requires much effort and time unless you're a professional web developer. Many people with initial design skills face similar problems and spend much time searching for solutions. Often, everything comes with experience. Through trial and error, reading various articles, and watching videos on YouTube, we are looking for an opportunity to achieve the goal.

What is the Paragraphs module for in Drupal?

The capabilities of the Paragraphs module in Drupal are quite wide; it includes all the necessary functions. The module will enable you to develop and structure various content blocks on the page. Each block can be a gallery of images, text, or other types of content that can be added, deleted, or moved. This is very convenient and saves a lot of time. So, even a novice developer can quickly create a website with different types of content. But, for some options, you need a basic understanding of CSS.
Various methods are used to simplify and speed up the creation of web pages as much as possible. What is surprising is that these methods are common. The developers applied familiar functions and got amazing results.
For example, it uses the principle of templates and copy-paste. You don't have to create each block or paragraph separately. You can create templates that you can use when it's necessary. If you change the template to the settings, these changes are reflected wherever you use it. We can say that this is an advanced version of smart copy-paste.
At the same time, the module has flexible and wide settings, which make it possible to create paragraphs for specific projects. Each of the blocks you have created can be edited. After editing, for example, changing the text order, location, etc., you can move on to more detailed settings.

Adaptability by default

Sometimes, page design that automatically adapts to different types of mobile devices is a problem for those who design websites on a computer.
Some modules, similar in purpose to the Drupal Paragraphs module, may have some difficulties with responsive design. For example, if we are talking about Drupal Layout Builder, everything is more complex, and in our article, we will look at this issue in more detail. No additional solutions are required if you are using the Drupal Paragraphs module. The module initially has this functionality and adapts to smartphones and tablets independently. You just need to specify responsive layouts for paragraphs.

How to utilize Paragraphs to create complex page layouts?

  1. First, we need to add a content type (Home-Administration-Structure-Content types). It would be best to give it a unique name, which will appear on the Add content page. At this stage, you will also have access to basic settings and the ability to add a short description. Next, click "save."
  2. Going to Home-Administration-Structure-Paragraph types in the "Label" field, we need to enter the name we gave on the first step. Here, you can also add an icon and description.
  3. Now, we need to add fields to the paragraph type (Home-Administration-Structure-Paragraph types-Image overlay-Manage fields). The drop-down menu gives us various options and the ability to customize the settings. You can create a paragraph with multiple fields, for example - question/answer for an FAQ page. The names of the fields will be displayed; please keep this in mind.
  4. Next, you need to return to "Content types" again, click "Manage fields" next to the name that we came up with earlier, and add it to Paragraph using the drop-down menu (Reference revisions menu subsection). In the Field Settings tab, we also see additional settings.
  5. For each content type, you can select paragraph types. In "Paragraph types," this is displayed as a list. This will allow us to add one or more paragraphs to the content types. If you don't select anything, all types will be available.
  6. Also, you can create one type of paragraph "within" another. For example, this could be several pictures with descriptions located horizontally within one gallery.

Regardless of whether you need to add an image gallery or text, the steps are pretty much the same. The only difference is that when creating a gallery, you will add images.

Adding your own classes

If necessary, you can add your own classes to CSS that extend the capabilities. To do this, go to Manage fields, and in the “Add a new field” menu, select Reference/Other. Next, in the Field settings tab, open the Type of item in the Reference menu and select Classy paragraphs style.
Next, we define the classes (Home-Administration-Structure, Add classy paragraph style). Now, you can bind a class to a paragraph. The class can be, for example, a background image or color. Now, you can add classes to your code and use them on the page.

Drupal Layout Builder vs. Paragraphs

Of course, other modules in Drupal have such capabilities. An example is Drupal Layout Builder. Both modules have similar goals but differ in functionality. You can achieve approximately the same goals using both of these modules, but the approach is different. Without going into details, we can say that the Drupal Paragraphs module is simpler. This module allows you to create web pages without having deep knowledge of Drupal; it is intuitive.
In addition, there is the problem of adaptive design. There are more differences, but we will not describe them all in this article; that is not our goal. Responsive design is what every modern web developer wants, and this is not an exaggeration. If you use the Drupal Paragraphs module, this feature is available to you by default. Drupal Layout Builder to create a responsive design will require additional Bootstrap installation; in some cases, more is needed.
The ease with which you can create pages at first is surprising, especially for people who don’t have much experience. After all, many people believe that creating successful websites with various types of content is complex and requires a professional. If you want to learn more about the features of working with the Drupal Layout Builder module, read our material on this topic. On the other hand, each module has its pros and cons, but each allows complex page layouts. Each user will give his or her own answer to the question of which of the two modules is better.

The compatibility of the Paragraphs module with other Drupal modules

Another huge plus is the ability to work generally with other useful Drupal modules:

  • DrupalView;
  • Drupal Panels;
  • Drupal Reference;
  • Drupal Display Suite;

And some others.

3 Actionable tips for maintaining a well-performing Drupal site with Paragraphs

Here are some content management best practices:
Tip #1. The translation feature can be pretty useful, but it needs to be used correctly. The module will automatically translate most text content on the page. However, some types of content are not supported. In particular, you may see a “not supported” label next to the Paragraphs field, and you should not enable translation for this field. However, you can allow translation of other types of text on the page. What to do with those areas that were left without translation? You can hide them by clicking on the checkbox in the “Content language and translation” window.

Tip #2. You can add several types of paragraphs in one field. To change the order, simply drag them with your mouse. Content Management with Paragraphs is effortless.

Tip #3. Keep it simple. For example, you can also use this module to create a simple slideshow on a page. And there is no need to connect additional modules. Select Slick_slider (Home-Add content, Page_Paragraph), and add an image. The module will create a slideshow from them. As you can see, nothing complicated.

Conclusion

In this article, we got acquainted with the Paragraphs module, which has extensive capabilities for creating and managing content on website pages. In one article, we cannot cover all the details about the Paragraphs. The article would be too long. But, with new knowledge, you will be able to create attractive pages for your website. Still have questions - just let your Drupal company know! 

P.S. It is advisable to seek assistance from experts who specialize in areas where you may have weaknesses. This approach will help to minimize the wastage of both time and money.