User Level: 
Click on an image to make it bigger.
D8 Structure - Paragraphs - Add Paragraph Field - Navigate to Page Content Type

1. Navigate to Content Type's Manage Fields Screen

Go to Admin Menu > Structure > Content Types > Page > Manage Fields.

D8 Structure - Paragraphs - Add Paragraph Field - Click Add Field

2. Add a Field

From the Manage Fields screen:

Click the Add Field button.

D8 Structure - Paragraphs - Add Paragraph Field - Add Paragraph Reference Type

3. Select Field Type

From the Add Field screen:

Add a New Field select field = Paragraph.

Label field = Paragraphs.

Machine-Readable Name text field = change to par_main.

Click the Save and Continue button.

D8 Structure - Paragraphs - Add Paragraph Field - Set Number of Values

4. Set Number of Values

From the Paragraphs Field Settings tab:

Allowed Number of Values select field = leave set to Unlimited.

Click the Save Field Settings button.

D8 Structure - Paragraphs - Add Paragraph Field - Finalize Paragraphs Settings

5. Finalize Paragraph Settings

From the Paragraphs Settings for Page screen:

Label text field = leave original text in.

Help Text text area field = enter some help text, if desired.

Required Field checkbox = leave unchecked.

Reference Method select field = leave set to Default.

Which Paragraph Types Should Be Allowed? option set = select Exclude the Selected Below.

Type checkboxes = leave unchecked.

Click the Save Settings button.

D8 Structure - Paragraphs - Add Paragraph Field - Paragraph Field Added to List

6. Paragraph Field Added to List

You will be redirected to the Manage Fields screen.

The new Paragraphs field will appear in the list.

D8 Structure - Paragraphs - Add Paragraph Field - Click Add Group Button

7. Add a Field Group

Now we'll add a field group to help make the user interface a little easier to work with.

Click the Manage Form Display tab.

Click the Add Group button.

D8 Structure - Paragraphs - Add Paragraph Field - Add Fieldgroup Info

8. Add Initial Fieldgroup Info

On the Add Group screen:

Add a New Group select field = Details.

Label text field = Click to Open Paragraphs.

Machine-Readable Name text field = click_to_open.

Click the Save and Continue button.

D8 Structure - Paragraphs - Add Paragraph Field - Add Optional ID or Classes

9. Add Optional Elements

On the Add Group screen:

Field Group Label text field = leave original text.

Display Element Open by Default checkbox = leave unchecked.

Mark Group as Required If It Contains Required Fields checkbox = leave checked.

ID text field = add an optional ID selector, if desired.

Extra CSS Classes text field = add additional CSS classes, if desired.

Click the Create Group button.

D8 Structure - Paragraphs - Add Paragraph Field - Fieldgroup Added

10. Fieldgroup Added

The new fieldgroup will appear down in the Disabled section of the Manage Form Display screen.

D8 Structure - Paragraphs - Add Paragraph Field - Reorder Fields

11. Reorder Fields

Drag the new Click to Open Paragraphs fieldgroup up into the enabled section.

Drag the Paragraphs field under the field group and nest it.

Reorder the remaining fields as desired by dragging them.

Click the Save button.

D8 Structure - Paragraphs - Add Paragraph Field - Form Display Completed

12. Adjust Paragraph Form Display

Click the Manage Display tab.

D8 Structure - Paragraphs - Add Paragraph Field - Click Manage Display

13. Go to Manage Display

D8 Structure - Paragraphs - Add Paragraph Field - Reorder External Display Fields

14. Adjust External Display

Rearrange the fields so that they are ordered:

  • Body
  • Paragraphs
  • Links

Select Hidden for all Labels.

Click the Save button.

The Paragraph field has now been added to our Page content type.

Now it's time for a test drive.