With this new cool update that combines JetWooBuilder and JetPopup functionality, you’ll be able to display different content and add different widgets in a popup easily.
For example, you can display your products with the help of the Product Grid widget and add a popup with a message “Product successfully added to your shopping cart” to it. This is really useful because there no more need to check the cart when you’re adding a new product and the client will see a notification. Also, you can display a popup wherever you need and add it to different widgets.
1 Step — Create a new popup
Firstly, you need to create a popup with the help of the JetPopup plugin. To do this, open your WordPress Dashboard and navigate to the JetPopup > Add New Popup. Then, give your popup a name, click on the Publish button, and then edit the popup with Elementor.
2 Step — Add a widget to the popup
For this tutorial, we’ll add a Heading widget to a popup as an example, but you can add any widget you need. So, drag-n-drop the Heading widget to the needed section to create a notification.
Then, you can style your popup according to your preferences.
It’s important to enable Loading content with Ajax and Force Loading options in the popup settings. To find these features, click the settings button in the bottom left corner of the Elementor left-side menu.
Don’t forget to add conditions for your popup. To do it, go to the Display Settings section, click the “Display Conditions” and then “Add Condition” buttons, and choose where you want to display the popup.
3 Step — Add the popup to the Products Grid
You can add a popup to any of the versatile JetWooBuilder widgets, be it Products Grid, Products List or Archive Add to Cart widgets. Open the page where you want to place a product gallery with popup notification and drag the necessary widget to it. After that, you’ll need to enable the JetWooBuilder Cart Popup option.
To do that, go to the Advanced settings, open the JetPopup section and enable the JetWooBuilder Cart Popup option. Then, in the Template drop-down menu choose the popup you’ve created before.
The last step is to check how your popup will look in action.
Now you know how to display different content that can appear in the popup with the help of the JetWooBuilder and JetPopup plugins.