Getting Content Into Your Design

This page explains how content from your SCF/ACF fields automatically appears in your Divi designs. Divi Handoff uses Divi's structure (Sections, Rows, and Modules) to display your content.

Think of it like this:

• Flexible Content field = A container for different types of content blocks
• Layout = A type of content block (e.g., "Hero Section," "Team Member," "Testimonial")
• Sub-fields = The form fields within each layout (e.g., title, description, image)

When you build a Divi Handoff Layout, you're creating a Divi design with Sections, Rows, and Modules. Divi Handoff automatically fills those modules with content from your fields.

How It Works

When someone visits a page with Divi Handoff enabled:

1. Divi Handoff checks if the page has Flexible Content fields
2. For each content block on the page, it finds the matching Divi Handoff Layout you designed
3. It fills in your design with content from the fields
4. The page displays with your beautiful Divi design and the actual content

Two Ways to Get Content Into Your Design

Method 1: Handoff Modules (Automatic)

Divi Handoff includes four special modules that automatically pull content from your fields:

Module	Purpose	Works With These Field Types
Handoff Text	Display text content	Text, Textarea, Rich Text Editor, Email, URL
Handoff Image	Display images	Image, File (images only)
Handoff Video	Display videos	File, Video URL
Handoff Repeater	Show lists of items	Repeater, Relationship, Post Object

How it works:

1. Add a Handoff module to your Divi Handoff Layout (in a Section, Row, or Column)
2. In the module settings, select a field from the SCF/ACF Field dropdown
3. The dropdown shows all fields from your Flexible Content layout
4. When the page loads, the module automatically shows the content from that field

Why use Handoff modules:

• ✅ Easy to use—just pick a field from a dropdown
• ✅ Automatically knows which content block it's displaying
• ✅ Handles different field types automatically
• ✅ Includes options for adding text before or after the content
• ✅ Can turn content into links

Method 2: Divi Dynamic Content (Manual)

You can also use any regular Divi module with Divi's Dynamic Content feature:

1. Add any Divi module (like Text, Image, Button, etc.) to your layout
2. Click the Dynamic Content icon (⚡) on any text field
3. Select SCF / ACF Pro Flexible Content Fields
4. Choose the field you want to display

When to use Dynamic Content:

• When you need a specific Divi module that doesn't have a Handoff version
• For styling options only available in certain Divi modules
• When you want to mix static text with dynamic content in the same field

How Each Content Block Works

When Divi Handoff displays a content block on a page:

• It uses the content from that specific block's fields
• All modules in your Divi Handoff Layout pull content from that same block
• Each content block on the page uses its own content

For example, if you have 3 Team Member blocks on a page:

• Team Member Block 1 → Uses content from Block 1's fields (John's photo, name, bio)
• Team Member Block 2 → Uses content from Block 2's fields (Jane's photo, name, bio)
• Team Member Block 3 → Uses content from Block 3's fields (Bob's photo, name, bio)

Even though they all use the same Divi Handoff Layout design, each one shows different content because each block has its own fields.

Using Repeaters Inside Your Layout

When you use the Handoff Repeater module to show a list of items:

1. The Repeater module goes through each item in the list
2. For each item, it shows the content from that item's fields
3. Modules inside the repeater (like Handoff Image or Handoff Text) automatically use the current item's content

For example, in a Team Section:

• Section Title → "Our Team" (from the main layout)
• Team Members List (repeater):
  • Item 1 → Shows John's photo and name
  • Item 2 → Shows Jane's photo and name
  • Item 3 → Shows Bob's photo and name

Each item in the list gets its own content, but they all use the same design you created in your Divi Handoff Layout.

Show or Hide Content

Divi Handoff lets you show or hide Sections, Rows, Columns, and Modules based on field values:

Setting	What It Does
Visible on SCF/ACF Pro Layout Field	Choose which field to check
SCF/ACF Pro Layout Field Value for Visibility	Enter the value that makes it visible

How it works:

1. Divi Handoff checks the field value
2. If it matches what you set, the element shows
3. If it doesn't match, the element is hidden

Examples:

• Show a "Featured" badge only when a checkbox is checked
• Display a video section only when a video URL is entered
• Show different content based on a dropdown selection

Dynamic Backgrounds

You can set backgrounds for Sections, Rows, and Columns using content from your fields:

Setting	Location	What It Does
Background from SCF/ACF Pro Layout Field	Background settings (sections, rows, columns)	Choose a field to use for the background

What works:

• Image fields → Uses the image as the background
• Color picker fields → Uses the color as the background
• Text/URL fields → Uses the URL as a background image (if it's a valid image URL)

Divi Handoff automatically figures out if the field contains an image or a color and applies it correctly.

Troubleshooting

If content isn't showing up:

1. Check the layout mapping - Is the correct Divi Handoff Layout connected to your content block?
2. Check the field selection - Did you select the right field in the module settings?
3. Check field names - Do the field names match exactly?
4. Check if content exists - Is there actually content entered in that field on the page?
5. If using a repeater - Make sure you're using the Handoff Repeater module, not a regular repeater

What's Next

• Handoff Text Module - Learn how to display text content
• Handoff Image Module - Learn how to display images
• Handoff Repeater Module - Learn how to display lists of items