< Toggle Sidebar > Toggle Sidebar

ACF Field as Background

Introduction

Th Breadcrumb Module supports the ability to use an Advanced Custom Image Field (ACF) as the background. Please note that ACF is a third party plugin which you need to install separately.

Create New ACF Field Group

Create a new ACF “Field Group” and associate it with a Post Type. Next, add an Image field to the field group. In our example the field is “Breadcrumb Background” and the post type is “Page”

Create a new ACF “Field Group” and associate it with a Post Type.
Create a new ACF “Field Group” and associate it with a Post Type.

Upload an Image to the ACF Field

Upload an image to the post type. In our example the post type is Page, so the Breadcrumb Module on that page can pick it up.

Populate image in ACF Field
Populate image in ACF Field

Set up the Breadcrumb Module to use the ACF Field

To set up the Breadcrumb Module do the following:

  1. Set “Is background image static?” to No
  2. Set “Use Featured Image For Background” to No
  3. Set “ACF Field Name” to the name of the ACF field. In our case its “breadcrumb_background”
Add ACF Field name to Breadcrumb Module Settings

The process is complete.

You will see something similar to the picture below on your frontend:

Demo Breadcrumb background for header powered by ACF Field.
Demo Breadcrumb background for header powered by ACF Field.
Breadcrumb Header for Divi Builder

Breadcrumb Module

Adds a new clean header with breadcrumbs powered by the Yoast SEO plugin. 
Learn More