Introduction
Divi Overlays have 4 ways to close the Overlay. Basically to close an overlay on any section, row or module, you need to use the CSS Class:
close-divi-overlay
So different ways to close an overlay are:
1) The default close button that could be styled. You can follow this tutorial in order to style your Defualt Divi Overlays close button.
2) A Custom close button. Using the CSS Class.
3) Pressing the ESC key
4) Clicking outside the overlay content. This needs to add a class into the section settings, so if you need this, the section shouldn’t have any change in the size.
So this tutorial is for this, to close
Step 1: Go to Divi Overlays Posts
1. Go to WordPress dashboard
2. Open Divi Overlays CPT (Custom Post Type)
3. Go to your Divi Overlays post
Step 2: Setting the Close Button – Clicking outside the content
1. Open the section settings
2. Go to Advanced Tab > CSS ID & Classes > CSS Class
3. Add the CSS Class close-divi-overlay
Save changes and now your overlay can be closed clicking outside the content area 😊
Setting the Close button – Using A Divi Module
1. Open the module settings
2. Into the URL field, add an anchor link #close
3. Go to Advanced Tab > CSS ID & Classes > CSS Class
4. Add the CSS Class close-divi-overlay
