1. Home
  2. Docs
  3. Hello! Pro 3 Theme Setup
  4. Demo Homepage Blocks Guide
  5. Opt-in

Opt-in

The “Opt-in” section on the homepage is constructed using Gutenberg blocks. When using Genesis 2.8, this section is installed when using the optional Auto-Setup Homepage feature.

Container Block

This section is created with an Atomic Blocks “Container” block. In the Gutenberg settings for the Container block, we set the following options:

  • Width: Full-width
  • Top Padding: 10%
  • Bottom Padding: 10%
  • Left Padding: 12%
  • Right Padding: 12%
  • Inside Container Max Width: 1000px
  • Background Image: (default image bundled with the Theme)
  • Image Opacity: 70
  • Background Color: “Dark Gray” #333
  • Additional CSS Class: opt-in

Content Blocks

Inside the AB Container block, we added the following blocks:

  1. A paragraph block containing the large Heading Text
  2. A paragraph block containing the Supporting Text
  3. A shortcode block to display our Email Newsletter Sign-up form

For the large Heading Text, we set the Font Size setting to: Huge and the Text Color setting to: Primary Color (default: #ce461c).

The Supporting Text uses default settings.

The Shortcode block allows you to insert your preferred Contact Form in this space — download your preferred Contact Form plugin, publish a new form, and paste its shortcode here.

Was this article helpful to you? Yes No