Creating our Jumbotron Block

The Jumbotron Block consists of three fields: Heading, Summary, and Button. We will take advantage of custom block types to create our new block, which we can then use to create a Twig template that contains the proper markup for Bootstrap to display the content as shown previously.

Step one - Creating a custom block

Navigate to /admin/structure/block/block-content/types and perform the following tasks:

1. Select the Add custom block type button.
2. Add a Label: Jumbotron.
3. Select the Save button.
4. Select the Manage fields button next to the Jumbotron Block Type.
5. Add the following fields:
   • Headline: Text (plain)
   • Button: Link

6. Select the Manage form display tab.
7. Reorder the fields:
   1. Block description.
   2. Headline.
   3. Body.
   4. Button.

5. Select the Manage display tab.
6. Reorder the fields:
   1. Headline.
   2. Body button.

Step two - Adding a new Jumbotron block

Navigate to /admin/structure/block/block-content and perform the following tasks:

1. Select the Add custom block button.
2. Select Jumbotron.
3. Add a Block description...