Simple Slider with Advanced Custom Fields and OWL Carousel


September 22, 2014



A lot of websites have a image slider. Most of the time there is just a simple slide effect required and it is not necessary to use a huge JavaScript library like the Revolution Slider or the WooSlider.

We have been using the OWL Carousel for several different web-projects and we are very happy with the simple integration and the features it provides. Together with Advanced Custom Fields and the Gallery Add-on it does not take a lot of time to create a slider and the styling is pretty simple as well.

ACF Gallery Settings

You can use this tutorial without WordPress and ACF as well, but then you have to set up the list-structure of the slider manually.


In the standard version we are just getting the images to display:

If you would like to show some text like the image title you have to render it inside the list-element (see line 8-10).


JavaScript for OWL Carousel

We have been using some settings like the interval and the slide speed to control the behaviour of the slider. You can find all available settings here.



Basically there is just a styling of the slide appearance required. If you are showing additional content like the title you have to adjust this container with the following code:


You find examples of the slider here:

INTERNETKULTUR | © 2021 | Imprint