How to display ACF Relationship posts in a grid

ACF Relationship component for Elementor free version is a very useful widget with which you can build posts grid with the ACF relationship field which is valued on the current post.
The ACF Relationship/Post objects are fields that allow you to create ‘Parent/Child’ type relationships, establish related content link or share data of the same nature.

The component also works fine with the ACF ‘Post object’ field.

Table of Contents

How to activate ACF Relationship grid

The Relationship field provides a duel-column component to select one or more posts, pages or custom post type items.
You have created the group and the ‘Relationship’ type field in ACF.

You have selected the posts / pages / CPTs and saved the post.

Open it in the Elementor editor.

The ‘Elementor‘ plugin is installed and active.

The ‘ACF‘ plugin is installed and active. 

The ‘EAC components‘ plugin is installed and active.

From the settings panel you have to drag & drop the ‘ACF Relationship‘ icon on the panel preview.

Select the source and filter the post types

As you can see, you can select any of the Relationship or Post objects field as the source.
These fields support ‘Post object‘ or ‘Post id‘ formats.
You can filter what post types will be displayed.

ACF relational select field

Select the content you want to display

The field ‘Posts count‘ lets you to select how many posts you want to display in the grid.

Very useful if you want to display, for example, the first three posts as related posts.

Content: Select what parts you want to add for each post.

Title: Select the title tag.

Excerpt: limit the number of words exposed for the summary.

Layout: Select the number of columns per row that will be showed for each device.

ACF relational content

Styling the post grid

Global section: Select the desired style who will be applied to the posts and the bottom margin.

Title, Date and Excerpt sections: Change font size and font color.

By default the Image ratio feature is enabled and you can position the image vertically.

ACF relational style image

5 thoughts on “How to display ACF Relationship posts in a grid”

  1. Cześć! Hi! I have a problem. Unfortunately, in the “Relational Field” list, I cannot see the relationship fields I have created in AFC. What may be the problem? Thank you in advance!

    • Hi Marcin,
      I assume you are up to date with ACF and EAC versions and saved the post well before editing it with Elementor.
      First, in your post, add a ‘Text editor’ widget, open the list of dynamic tags and select the entry ‘ACF relational’ and tell me if you find the field in the list
      Second, proceed in the same way and select, this time, the entry ‘ACF Text’ and tell me if you find the field in the list
      Finally you can look at the traces in ‘Elementor/System info’, section ‘Log’ if you find data related to EAC.

  2. Hi,
    Incredible plugin! You need to publish it on the wordpress repository !
    The images on the ACF RELATIONSHIP GRID are not displayed. The Feature Image option is checked and is configured on the displayed items. And then I check “date” or “except”, they show up.

    • Hi Valentin,
      Sorry for the inconvenience but i just tested the ‘ACF Relationship grid’ component with version 1.9.6 and the behavior of the image is consistent and displays correctly with or without the ‘Date and/or excerpt’ options checked.

      • Ok my bad.
        After a some research, I didn’t authorized featured images request from my ACF plugin.

        Thanks a lot !


Leave a Comment