View Categories

MetaSlider and Advanced Custom Fields

Advanced Custom Fields (ACF) is a very popular WordPress plugin, with over 2 million active installs.

If you use ACF to add fields to your content, it’s possible to use MetaSlider Pro to show those fields in a slideshow. In this guide, I’ll show you how to connect ACF and MetaSlider.

This screenshot below shows an example of fields created using ACF. There’s a field group called “Photo Details” and there are three text fields:

  • Photographer
  • Photo Agency
  • Camera
Advanced Custom Fields dummy fields

Those fields are added to WordPress posts. You can see an example in this next screenshot. The ACF fields are below the content and there’s a Featured Image to use in the slideshow.

Advanced Custom Fields in a WordPress post

Using MetaSlider Pro, you can create a slideshow using a “Post Feed” slide type. When you first add a Post Feed slide, it will look like the image below.

First slide for a slideshow with Advanced Custom Fields and MetaSlider

Click on the “Insert Tag” dropdown and you can choose your fields from ACF. In this next screenshot, I’m choosing the “Camera” field.

Adding field to a slideshow with Advanced Custom Fields and MetaSlider

You can use the HTML area to control how your fields display. In this screenshot below, I’ve added three fields called {photographer} and {photo_agency} and {camera}.

Creating a slideshow with Advanced Custom Fields and MetaSlider

When you show this slideshow on your site, all the custom ACF fields will be displayed, using the HTML you created:

Completed slideshow with Advanced Custom Fields and MetaSlider