How to make DIVI slider arrows visible all the time?

The DIVI slider arrows are visible on hover, this article will teach you how to enable slider arrows all the time.

What is Divi?

DIVI is one of the most popular WordPress themes. It came with a lot of cool features which makes it very easy for a non-tech guy to design a website in a very shorter time.

Divi Slider module

DIVI provides a built-in image slider that is very customizable. When there are multiple images in the slider it is recommended to show slider arrows otherwise your site users will consider it a static image unless you have enabled auto-scroll for it.

In this article, we will cover the following 3 steps to achieve Divi slider arrows:

1. Create a Divi slider
2. Setup slider settings
3. Add custom CSS

Step 1: Create a slider

The first step is to insert the slider module. Click the insert module and search for “slider”.

Step 2: Slider settings

After adding the slider, click on the module settings:

Open the Content tab (1) and under Elements, select YES (2) for show arrows:

Click the green tick (3) button to save settings.

Step 3: Add CSS to make DIVI slider arrows visible

Once the settings are saved. Open theme customizer, and under Custom CSS add the following CSS snippet:

/* show slider arrows always for DIVI theme */
.et-pb-arrow-next {
     opacity: 1;
     right: 22px;
}
.et-pb-arrow-prev{
     opacity: 1;
     left: 22px;
}

Save it.

After adding the CSS snippet, the slider arrows will become visible all the time.