ACF Item Module

Written by the Divi Engine Documentation Team

Watch This Video


Follow these steps to learn how to use the ACF Item module.

Step 1: Create A Custom Field

Make your way to ACF, create a Group and add an ACF Field assigned to an appropriate location.

  • Users.
  • A Custom Post Type.
  • Divi Posts.
  • Divi Projects.
  • Post Category.
  • Post Taxonomy.

Step 2: Build A Post

Head over to your posts linked to the above Post Type and add ACF Field information.

Step 3: Add ACF Item Module

After adding the ACF Item Module you will need to customize it by selecting the ACF Name.  Please view the ACF Item Module settings below.

ACF Item Module Settings

Main Options

  • Repeater Custom Label: Define the ACF item label.
  • ACF Name: Select the ACF Field to display.
  • ACF Field From: Select the type from where the field is found.
  • User Field Type: Select the User Field for the ACF Field User Type.
  • Field Taxonomy ACF Name: Select the Taxonomy Name for the ACF Field Category etc. Type.
  • Post Object ACF Name: Select the linked post field.
  • Value HTML Tag: Select the HTML tag for the ACF Field.
  • Show Label: Enable to the Field Label.
  • Prefix: Define a prefix value (for example "Β£").
  • Suffix: Define a suffix.
  • Text Before: Define some text to appear before the ACF value.
  • Label Separator: Define a separator between the label and value.
  • Custom Label: Define a Custom Label.
  • Visibility: Select who can see the ACF Field.
  • What To Do With Empty Value: Select what to do when the ACF Field is empty.
  • Hide Element Selector: Define element ID to hide when the ACF Field is empty.
  • Custom Text: Define text to display.

Specific Settings

  • Image/File/Link: Select ACF Field return format.
  • Image: Link Image to an ACF field.
  • Image ACF Field: Select the Image ACF Field.
  • Checkbox Style: Select the Checkbox style.
  • Checkbox/Radio Return Type: Select return type.
  • Checkbox/Radio Field Is A URL: Enable to make the file or link a button.
  • Checkbox/Radio Field Make  A LInk: Enable to make the Field a link.
  • File/Link/Email/Phone Make A Button: Enable to make the ACF field a button.
  • Email Subject: Select email subject if the ACF is an email field. 
  • Email Body Text: Define body text if the ACF is an email field.
  • Email Body After: Select content for after your body text if the ACF is an email field.
  • Email Custom Parameters: Define custom parameters to prepend on the link.
  • Link/URL New Tab: Enable to open link in new tab.
  • Link/URL Set Name: Enable to set the name of the download link as an ACF field.
  • ACF Name: Select the ACF field.
  • Custom Text For Button: Define custom text for the button.
  • File/Link Field Remove Website Link Name: Enable to remove the website link name.
  • Image Size: Select the size of the image.
  • True/False Text When True: Define text when the ACF field is true.
  • True/False Text When False: Define text when the ACF field is false.
  • Is Audio: Enable when the ACF field is audio.
  • Is Video: Enable when the ACF field is a video.
  • Prettify Your Text: Enable to prettify your text.
  • Prettify Separator: Define the separator.
  • Number Decimal: Define the number decimal.
  • Text Make Image: Enable to turn text URL into an image.
  • ACF Options Page: Enable ACF Pro options page.
  • Inside Repeater Loop Layout: Enable if using this ACF Item Module inside a Custom Loop Layout of a Repeater Field.

Relational Field Settings

  • Relational Field Style: Select how to display your Linked Post.
  • Relational Field Loop Layout: Select Linked Post Custom Loop Layout.
  • Grid Columns: Select the number of columns on desktop.
  • Tablet Grid Columns: Select the number of columns on tablet.
  • Mobile Grid Columns: Select the number of columns on mobile.

Repeater Advanced Settings

  • Repeater Dynamic Field Button Name: Select a Text Field to define the URL button when using a Repeater Field Type.

Conditional Settings

  • Checkbox/Select - Add Value: Enable to add the Checkbox/Select as a CSS class.
  • Loop Layout: Enable to use this as a Loop Layout.
  • CSS Selector: Define CSS Selector.
  • CSS Name Prefix: Define content before the CSS Class.
  • CSS Name Suffix: Define content after the CSS Class.
  • True/False: Enable to hide another element using a True/False Field.
  • Hide Element With This Selector: Define a CSS Class.

Image & Icon

  • Use Icon: Enable to use Icon.
  • Icon: Select the Icon.
  • Image/Icon Placement: Select the Image/Icon placement.
  • Image Mobile Stacking: Select the Mobile Stacking.
  • Select Image: Select the image.
  • Custom Image Max Width: Select the Image Max Width.

More Support?

Please email us at [email protected] if you are unable to get Divi Machine working.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.