Загрузка страницы

Divi Popup: No Plugins Required! [Ultimate Guide]

Welcome to the ultimate tutorial about creating custom popups in Divi. No plugins are required, and we will only be using CSS and jQuery - no other scripts! If you have a Divi website, you're all set! It is all we need :)
You can choose between 3 options here: easy, intermediate, and advanced.

The easy option is to download my free layout with the Divi popup, and you can get it here: https://divilover.com/divi-popup-without-plugins-tutorial/
The intermediate option will be using a copy and paste method. The explanation is at the beginning of this video tutorial, and the snippets are available in the article linked above.
The advanced option guides you through creating a popup in Divi step by step, showing you how to do this on your own with just CSS and jQuery. This is also the option that allows for the most customization because I will show you many variations of this popup so you can find the perfect one! It starts here: 00:08:29

I hope you find this tutorial useful, and also easy to understand and accessible. If you have any questions, you can ask them in the comments, and I'll do my best to answer. You can also join the Divi Lovers Facebook group where it's easier to discuss web design problems :) https://www.facebook.com/groups/divilovers

Please, let me know if this tutorial was helpful - and also if you'd like to watch more content like this! I'm always looking for new Divi tutorial ideas.

This is a long, comprehensive, very detailed tutorial, so here is the table of contents for your convenience:
00:01:41 - Copy & Paste Method
00:07:10 - Free JSON File - Divi Page Layout with Popups
00:08:29 - Step-by-step Method - Setting up elements in the Builder
00:10:06 - Wrapping the Popup Section with additional HTML containers
00:13:03 - Initial Position and Hiding the wrappers with CSS
00:19:55 - Setting up Button trigger with jQuery
00:24:05 - Closing the Popup with jQuery
00:26:11 - Adjusting the Overlay for Admin Bar
00:29:31 - Centering the content inside the Popup
00:33:10 - Changing the cursor for the Close trigger
00:33:53 - Preventing the Body Scroll behind the Popup
00:36:11 - Fixing the Top Navigation z-index Issue
00:41:51 - Adding Animation
00:47:02 - Working with Video inside the Popup
00:56:05 - Closing the Popup on background click
00:58:36 - Triggering the Popup from the Menu
01:01:24 - Triggering the Popup automatically on page load

#divitutorial #divilover #csseffect #divitheme

Видео Divi Popup: No Plugins Required! [Ultimate Guide] канала Ania Romańska
Показать
Комментарии отсутствуют
Введите заголовок:

Введите адрес ссылки:

Введите адрес видео с YouTube:

Зарегистрируйтесь или войдите с
Информация о видео
15 июня 2022 г. 19:51:23
01:04:52
Яндекс.Метрика