Ultimate Divi Builder Addons - Give superpowers to Divi Builder!

Ultimate Divi Builder Addons – Give superpowers to Divi Builder

(5 customer reviews)

$59.00

Take the power of Divi builder to next level with Ultimate Divi Builder Addons – UDBA. You can activate popular jQuery libraries that used by million dollar websites with a switch of toggle. Currently there are 23 effects included in the plugin. You can use these effects on a page or theme template files.
Take the Plugin for a Test Drive > *Create a test site and activate Divi Theme. Then search for this plugin and activate. If you are testing the ‘Page-piling effects’ then please remove default footer widgets added to the site by Divi upon activation. You can download the Page-piling demo layout form the ‘Solutions’ tab below.

—Version 2 is now Released with Many Improvements!—

 

Get the BUNDLE and SAVE!

 

Live Demos are available in a separate tab below

Some of the cool effects you can create with this plugin include, Section Wipes EffectPage Piling Vertical scroll | Live Site DEMOPage Piling Horizontal scroll (with Menu Anchor Links), + many more…

 

Use coupon ‘UDBA’ to unlock Sale price* – $45


Don't have Divi? get it first from CLICK HERE

Download the old version from plugin's GitHub repo >

Description

‘Ultimate Divi Builder Addons (UDBA)‘ is the plugin that help you to re-create amazing effects you see in popular websites right inside Divi builder.

We all know Divi theme is a great tool to build web sites. The page builder is easy to use and intuitive. Theme customizer, the epanel allow to customize the design of your site easily. There’s one problem though, and it’s a big problem! When you look at all the sites built with Divi theme, they all look the same. You will need many lines of custom code to change default Divi theme look. You can never achieve the design and functionality of those popular sites that clients are willing to pay millions of dollars without hiring an expert developer. Let’s face it, If you are using a drag and drop page builder based WordPress theme like Divi, you should be able to create your masterpiece without touching a line of code. So, Are you a Divi web designer tired of giving same old designs to your clients? Don’t worry, you won’t be need to learn custom code or hire an expert developer anymore. All you’ll need is ‘Ultimate Divi Builder Addons – UDBA‘ plugin to help you create stunning web pages with switch of a toggle!

Take the Plugin for a Test Drive > *Create a test site and activate Divi Theme. Then search for this plugin and activate. If you are testing the ‘Page-piling effects’ then please remove default footer widgets added to the site by Divi upon activation. You can download the Page-piling demo layout form the ‘Solutions’ tab above.

* Featured in Elegant Themes Plugin Highlight Series… Check the post >

 

‘Ultimate Divi Builder Addons’ (UDBA) allows you to activate popular jQuery libraries that used by million dollar websites with switch of a toggle. Currently there are 23 effects included in the plugin. You can use these effects on a page or theme template files.

 

Get the BUNDLE and SAVE!

 

Here’s how you setup the plugin

 

Looking for a use case? then, See how easy it is to implement popular Full page scrolling technique in Divi with the help of our plugin

Download the old version from plugin's GitHub repo >

 

Terms of Sale:

You can use this product for both personal and commercial use on multiple websites. So feel free to use it on your own or client websites. You are not allowed to resell or redistribute this plugin or any of its parts to anyone else.

If you would like to package our plugins into your child theme, a developers license may be purchased separately. Please contact us for more details

You get product updates for lifetime – We will make every attempt to ensure that our products are compatible with all future releases of Divi builder. You can access product updates through ‘My Account‘ Page.

For product support you can directly contact us. We provide 3 months of direct product support – Support is provided for bug fixes only. If you need customization support you will have to pay our hourly rate ($50 per hour)

Please note, If you bought a product from our store at ‘SALE’ price Support will be provided strictly for product related bug fixes only.

Scope of Support – Our main intention by providing product support is to help uncover bugs, add frequently requested features and overall improve the product for everyone. We reserve the right to dismiss any support request that’s outside of this support scope.

  • Ultimate Divi Builder Addons is not responsible for any conflicts due to WordPress updates, Divi updates or third party plugin updates

Due to the nature of digital products as they cannot be returned, it’s impossible to prevent fraud and still offer refunds. Hence refund requests are expressly denied. You can use our test drive facility to check the product before you make purchase.


Compatible with PHP version 5.5 or higher

Live Demos

Effects in this plugin can be divided into mainly 3 categories:

1. General effects for Divi

2. Animation effects

3. Special effects for Divi

 

1. General effects for Divi

 

1.1 Custom Scrollbar Effect :

Add mobile responsive custom scroll bars to any builder element. Please note that you have to remove any element animation in the builder to make this effect work properly. There are 8 scroll bar designs to chose from.

Demo

Source

 

1.2 Hide the Divi Theme Header when Scrolling Down : You can make the header hide when scrolling down and appear it when scrolling up.

Demo

 

1.3 Loading Header while Scrolling :

 Create a mobile responsive loading header effect while you scroll. This effect can used as a reading progress bar indicator showing the user how far scrolled through the current post or page they are. You can chose the color for reading progress bar. There are 4 effects to chose from.

Demo

Source

 

1.4 Scrolling windows :

By using this effect you can have your visitor focus on particular sections of the page. The user can scroll through the page but at the end it will always come back to the nearest section where “window” CSS class is held. You may want to use ‘Hide the Divi Theme Header when Scrolling Down’ to make this effect appear better for the viewer.

Demo

Source

 

 

2. Animation effects

 

2.1 Fade Into View :

Make elements fade in and out of view when they enter/exit the window. Works best with dark backgrounds.

Demo

Source

 

2.2 Flipping Text :

 Add real time typing animation to Divi text module. It creates a ticking intro animation for your typography. You can adjust the font from Advanced Design Tab of the Text module.

Demo

Source

 

2.3 Scroll Flow :

Nice scroll animations to add to any Divi Module or Row. These animations works both page scroll up and down. You have 5 animations to choose from.

Demo

Source

 

2.4 Scroll fx :

Scroll fx is a jQuery effect for smooth scroll-triggered animations that allows scaling text and changing the background opacity as you scroll pass them.

Demo

Source

 

2.5 Scroll Trigger :

Animate any Divi module with nice slide in animation. This works with both page scroll up and down.

Demo

Source

 

2.6 Revealator Animation :

Viewport Triggered Element Animations. These animations works both page scroll up and down. You can choose from 9 animation types.

Demo

Source

 

2.7 Scroll Magic Responsive Duration :

 This effect works best with Button or Call to Action modules. It creates nice zoom in and out animation to these modules as the user scroll through the page. Scene duration depending on viewport size.

Demo

Source

 

2.8 Scroll Reveal :

Reveal modules on scroll. These animations works both page scroll up and down. There are 17 animation effects to choose from.

Demo

Source

 

2.9 WOW Animation :

CSS animations as you scroll down a page. You can animate any Divi module with this effect. You need to remove all default animations in the builder in order to make this effect work. You have total 75 animation effects to choose from.

Demo

Source

—Update—

‘WoW animation library’ is already integrated into Divi builder with latest update released by Elegant Themes. Please use those animations instead of plugin’s wow animation classes. You can still use these effects on other page builder tools or in your child theme’s template files, Widgets,…
 

2.10 Super Easy Text Rotator :

Add a super simple rotating/ticking text to your website with little to no markup. You have 5 text animations to choose from. You can use these animations to any Divi module that has a text field. Use commas (,) to rotate texts inside span class.

Demo

Source

 

 

3. Special effects for Divi

 

3.1 Stacking Effect :

A jQuery effect that creates a stacking effect by sticking panels as they reach the top of the viewport. You may want to activate ‘Hide Divi Theme Header when scrolling’ to make this effect appear better. There’s a conflict with Divi slider module. Activate ‘Remove this effect in small screen sizes’ option if necessary.

Demo

Source

 

3.2 Scroll Magic Section Wipes :

Wiping in content with the natural scroll movement. This effect is similar to Stacking Effect mentioned above but it doesn’t have the conflict with slider module. You need to use this effect from second section onwards. This effect is not mobile optimized so you may want to enable ‘Remove this effect in small screen sizes’ option.

Demo

Source

 

3.3 End Page Box :

This effect will let you add an end page box that will display when scrolled to the bottom or in any range on the page.

Demo

Source

 

3.4 Page Piling Vertical scroll :

This effect creates responsive scrolling stack of pages. This is the effect to use if you want to build a one page scrolling page like ‘tumblr’ home page. Don’t activate page Piling Vertical scroll and page Piling Horizontal Scroll at the same time, It creates conflicts. This effect creates vertical scrolling for each section that has the CSS class. Use single module inside a section for best results. Activate ‘Remove this effect in small screen sizes’ option if necessary.

Demo

Live Site DEMO

Source

 

3.5 Page Piling Horizontal scroll :

This effect creates responsive scrolling stack of pages. This a new way to create a single scrolling page in which sections are piled one over another creating an original effect to present the information. You can use this effect to showcase your image gallery in a very attractive way. This effect creates horizontal scrolling for each section that has the CSS class. Use single module inside a section for best results. Don’t activate Page Piling Vertical scroll and Page Piling Horizontal Scroll at the same time, It creates conflicts. Activate ‘Remove this effect in small screen sizes’ option if necessary.

Demo (with Menu Anchor Links)

Source

 

3.6 Do Slide Horizontal :

 DoSlide is a javascrit library for full-page section scroll or horizontal slider. You can use this to have scrolling effect inside a Divi builder section. With each mouse scroll user can navigate next modules inside a row. The user can scroll through modules in the same section without having to scroll the entire page. This effect is not optimized for mobile display so you may want to enable ‘Remove this effect in small screen sizes’ option.

Demo

Source

Changelog

Version 1: Initial Release.

Version 2:
* Fixed errors with PagePiling effects. You can now disable common conflicts on scroll page IDs.

* Added an option to stop slider loop (prevent the panels from cycling through (ie: just stop at the bottom instead of going back to top).

* Added speed controller for: Pagepiling Slide Transitions, Text Rotator, and Flipping Text effects.

* You can now use Menu and Button Anchor Links with Pagepiling effects. See the DEMO (with Menu Anchor Links).

* Added an option to disable following effects from showing up in small screen sizes – When enabled effects only show up after a defined screen size (media query).
– doSlide Horizontal
– jQuery pagePiling Vertical scroll
– jQuery pagePiling Horizontal Scroll
– ScrollMagic Section Wipes
– jQuery Stacking Effect

Solutions

1. Page Piling Effects

 

Please remove default footer widgets added to the site by Divi upon activation. When you add footer widgets it affect the view port. Page-piling pages are special kind of pages. They are not scrollable like in a normal page so there’s a very little window to show contents.

 
If you want to show footer widgets section then we suggest you to either,
1. Hide them in PagePiling pages with CSS and add the widgets as a new sliding section,

#footer-widgets {
    display: none;
}

You can paste this into page options CSS panel.
Now you just need to design the same footer with Divi builder in the page. The footer will come at last in the slider. This does not affect other pages at all.

or,

2. Use Divi theme builder and design a custom footer using Divi builder.

…………….

If you are seeing the page you setup with this effect jump up/down before moving into next slide then please add following CSS code to page options panel. This will make sure your slide transition smooth and looks like our demo.

Click the page settings icon and in the pop up window you will find a place to add page specific CSS. There you need to add these codes:

.pp-section {
height: 83% !important;
}

@media only screen and (max-width: 600px) {
.pp-section {
height: 80% !important;
}
}

You can adjust the height base on your requirement.

 
One other thing that can cause this problem is customizations made under sizing tab in a Row module – Specially the height adjuster. Make sure the height is set to default ‘auto’. To check this go to each Row module (Designated in Green color) in the scroll page > Go to design tab > Select sizing options > Check if height value is set to ‘auto’. If not just press Undo.

…………….

If you want to change the color of side dot navigation then enter following codes to Divi theme options custom CSS panel.

#pp-nav span {
border-color: #ffa500 !important;
}

#pp-nav li .active span, .pp-slidesNav .active span {
background: #ffa500;
}

You can also change side dot navigation alignment (default aligned to right side) in the page with following code.

div#pp-nav {
right: unset !important;
}

…………….

If you are using a global section (Custom global footer,…) in your scroll page and added the Pagepiling CSS class to that then it will get applied to pages in your whole site. As a result of that pages you don’t need this PagePiling effect get affected. To solve this you need to use a seperate template for scroll page(s).

…………….

* Download our DEMO Page-Piling layout CLICK HERE
Import this to a new page using Divi builder import/export feature.

…………….

* To set up button Anchor links you just have to add ‘arrow’ CSS class to the section module so it will look like this: et_pb_section_pagepiling arrow

Then give the target slide number E.g: #sec1 , #sec2 , or #sec3 ,…. as the button URL.

 
 
…………….

2. Stacking Effect and Page Piling Effects

 
The plugin is designed to work with default Divi conditions – Default Divi header and footer.

If you are using a custom (Global) Footer/Header made with Divi theme builder then it won’t work well with these effects. You need to disable those sections on the pages where you are going to apply these effects. To do this,

1. Add a new theme builder template to the Staking or Pagepiling effect page.
2. It will show Global header footer as default.
3. Then you need to click on ‘Hide on Front End’ option.
– For Stacking effect Header is the only thing that cause problems so disable that, you can keep the footer as it is.
– For Pagepiling You need to disable both global header and footer. Then you can create those section designs on the Scroll page.

5 reviews for Ultimate Divi Builder Addons – Give superpowers to Divi Builder

  1. Avatar

    lobsterdm (verified owner)

    Excellent plugin for adding some really interesting effects to your Divi based website.

  2. Avatar

    Thibaut Goarant (verified owner)

    I am really enjoying the effect that this plugin is bringing to my website (https://kokoropanier.com). This bring a huge differentiation compared with my competitors in the business I am trying to developp. But the most delightful was the service, frankly I’ve been amazed how fast it was and how kind enough the people were to listen to my issues. No doubt, I warmly recommand their products, you won’t be disapointed!

  3. Avatar

    Sara Swallow (verified owner)

    Great plugin! I had a few modification requests and the support was awesome!

  4. Avatar

    Jean-Michel Scheidegger (verified owner)

    Awesome Support and just a great product! Thank you very very much for this nice tool

    Website: https://new.1410.media/

    Preview:

  5. Avatar

    Thanh Nguyen Duy (verified owner)

    Great plugin!
    I really like the effects of UDBA. I will use UDBA for my projects. It makes my website more beautiful.

    Website: https://implant.medent.vn/

    Preview:

Only logged in customers who have purchased this product may leave a review.