Specbee: Drupal Paragraphs Module in Drupal 9 - A Complete Tutorial
Paragraphs is a new way of content creation. It allows the site builders to make things cleaner and can give more editing power to the end-users.“Drupal Paragraphs” is a very popular module in Drupal, used for handling content. It is similar to content fields and provides a wide range of options for designs, layout, and grouping of content as per the requirements.
Types of Drupal Paragraphs & Its Usage?
Drupal Paragraphs can be of different types. They can be anything from an image to a video, or a simple text to a configurable slideshow. Instead of putting all the data in one body field, we can create multiple Paragraphs Types with different structures. This allows the end user to choose between pre-defined Paragraphs Types. By using Drupal Paragraphs, we can create multiple featured Paragraphs, allowing the end users to pick the one most suitable for their needs. The Drupal Paragraphs module is easily manageable for non-technical users, while also offering Drupal developers the ability to control the appearance of the elements at the theme level.
How to use the Paragraphs module in Drupal 9
1. Install and Enable Drupal Paragraphs module
You can find the information about the module and the current version of the module in the paragraph Drupal page.Run this command to install the paragraph module via composer:composer require drupal/paragraphs
After installing the module. Got to extend and enable the paragraph module.
The Paragraph module has a dependency on the Entity reference revisions module. We have to enable the Entity reference revisions module along with the paragraph module.
We have submodules under paragraphs that can be enabled as per the requirement.
Paragraphs demo, Paragraphs library, Paragraphs report, and Paragraphs type permissions. The description will give you a brief of the use case of the module.
2. Create a Paragraphs Type
To add a paragraph type go to Structure > Paragraph types (/admin/structure/paragraphs_type) and click on Add paragraph types.
Fill in the fields required to create a paragraph type. Here Label field is a required field, and icons, and descriptions are optional fields. We can change the machine name of the paragraph type by clicking on the edit button. After filling in the fields click on Save and manage fields.
3. Add fields to the paragraph type
Adding fields in a paragraph type is the same as adding fields in a content type.Clicking on Save and manage fields will take you to the manage fields tab.
In manage fields click on Add field. Here we can create a new field or reuse the existing field.
Select the type of the field, add a label, and change the field settings as per requirement. This is the same as how we add the fields in the content type.
We can add any number of fields as per requirement.
After adding the field we can see the list of fields added in the manage display form.
We can change the order and the configurations of the field in the form display in the manage form display tab. To change the order of the field click and drag the fields and to change the configuration click on the settings icon on the right end of the respective field.
On displaying the paragraph, we have the option to change the order and the format of the field value in the manage display tab. To change the order of the field click and drag the fields, to change the format click on the dropdown under the format and change the format as required for the respective field. We can align the label of the field and also make it hidden from the display. We have these options under Label.
We can translate the paragraph type if the site is multilingual in the Translate paragraphs type tab and clone the paragraph type from the clone tab where we have to give a new label for the cloned paragraph.
4. Add paragraphs to the content type
To add paragraphs to a content type we have to create a field of type entity reference revision which helps to refer paragraph types in the content type.
To add the field go to Structure > Content types. Click on the manage fields of the content type to which paragraph type should be added.
Click on Add fields. Select the paragraph under Reference Revisions and add a name for the field.
Click on Save and continue.
Here we have the option to set the limit for the field. If we want to add only one set of values for the paragraph change the Allowed number of values to limited and select the number that appears after selecting the limited option. After selecting the limit click on save field settings.
Clicking on save field settings will take us to a page where we can select the paragraph type that needs to be added to the content type selected. All the paragraph types created will be listed under Paragraph types. Here we have 2 options, select the paragraph types and select the option exclude the selected below, this will enable the paragraph types which are not selected. The other one is to Include the selected below which will enable the paragraph types which are selected in the list. After selecting the paragraph types click on save settings in the end.
There are different field widgets available for the entity reference revisions field which can be selected in the manage form display of the content type to which the field is added.
5. Add content to the paragraphs
To add the content go to Content > Add content. Select the content type to which the paragraph is added.
We will see the paragraph type added with all the fields added to the paragraph. To add multiple paragraphs click on add button with the paragraph name (Add Blog in the above screenshot) which will add a new paragraph of the same type. To remove the paragraph, click on the 3 dot option button next to the collapse and click on remove. And to duplicate the paragraph click on the duplicate.
Save the node after adding content to the paragraph.
Features of Drupal 9 Paragraphs module
Allows the editor to create different structures on each page.If there are different structures on the same page or different pages, Drupal paragraphs can be used. For ex. There is an image with text on the top and slideshow on the bottom. We can use Drupal Paragraphs to make this less complicated.
Allows the editor to change the order of the paragraphs.If there is a change in display, like there is an image on the top followed by title and description, and you want to change it to title to the top followed by image and description. Such changes can be done using Drupal paragraphs easily. Go to “manage display” of the paragraphs used and change the order, which will change the display order of all the content wherever the paragraph is used.
Paragraphs can be nestedOne Drupal paragraph field can be referred to in another paragraph field. While selecting field to paragraphs, select “Paragraph” under “Reference revisions” and select which drupal paragraphs type you want to add.
Final Thoughts
The Drupal paragraph module is a very popular module which is used in most of the websites created using Drupal. By using paragraphs, end users are asked only to add content as per their requirement and the developers can write the stylings using CSS for displaying the content. The styling and settings are done before adding the content. This makes the content creation easier for both the technical and non-technical users, allowing the content to appear in a consistent manner. If you are looking to develop a custom module for Drupal or any other Drupal development services, contact us.
