How to Create Dynamic Popups in Elementor - Step by Step

[@tomaskurka_official]

Thanks a lot, I haven't found any other solution except this one of yours, and I've been looking for a few days. This is very simply given and has helped me a lot.

[@hugomakes]

Awesome! Glad it helped :)

[@resology]

Hugo, you beautiful man. You just saved me hours of work. Thanks!

[@hugomakes]

Sweeeeeet! Glad I could help ;) xoxo

[@main.amenaakter]

I can't explain how important this video is to me,,,,, almost 2 days I searched for this solution. Finally, I got it. thanks a lot.May Allah reward you best

[@hugomakes]

Hi, thanks. Yeah it took me some time to figure out how to get it done. Glad it helped!

[@Russertron]

Perfect tutorial thankyou! I now have dynamic popups loading from a Dynamic table.

[@hugomakes]

Thanks for the comment! Glad it helps

[@GundamGeeksHub]

THANK YOU ! LIFE SAVIOUR! I WAS STRESSING OUT BECAUSE OF THE ISSUE. Glad to find your video!

[@hugomakes]

Yeah that's exactly why I made the video! Glad it helped you! :) Cool channel by the way.

[@bensmith4376]

This is the best tutorial out there for making these. Extremely helpful. Thank you!

[@hugomakes]

Thanks Ben really appreciate it. I'll have more advanced tutorials for Elementor in the future, so hope you stick around.

[@gersonmarques7447]

The best! awesome tutorial for a great feature! thanks

[@hugomakes]

Thanks for the kind comments. Glad it helped.

[@muneeburrahman8359]

Very helpful sir, keep going and Make a complete tutorial on crocoblock plugins

[@hugomakes]

Thanks -- my plain is exactly that! :)

[@main.amenaakter]

jajakallah🙂🙂

[@thegentlemanpilot6941]

Thank you very much for this tutorial! You made my day!!! Just a question: there's any chance to order the post with a specific order?

[@hugomakes]

Hi! Yeah there are actually various sorting options. If you go to this timestap kzbin.info/www/bejne/nXbGYaydfdZsp9ksi=v9hYHhnAg0KlQ0Zr&t=288 if you look at the widget options, you will see one called Posts Query. That's the area where you can find different types of filter capability, as well as ordering. Hope that helps!

[@thegentlemanpilot6941]

Thank you so much@@hugomakes I'll try it now!

[@thegentlemanpilot6941]

It works perfectly, now I'm struggling with the mobile version.

[@hugomakes]

What in particular are you struggling with? If it's that you have too many columns, in the first widget pane of the listing grid you can change it from 3 or 4 to 1 so it stacks nicely. Let me know!

[@daveswitzerland4442]

That was really good, thank you!!

[@hugomakes]

Absolutely! Glad to be of help.

[@travisbburch]

happy to find this tutorial after building this out in elementor's loops only to find it wouldn't work, but now I'm having trouble getting the dynamic fields to appear in the popup. The listing grid is populating correctly, but only static info appears in the popup

[@adamcook446]

Same issue here...I'm troubleshooting now, I'll let you know if I figure out a solution. Everything worked up until the very end too..I set the visibility setting, ajax, connected them to the listing grid, etc. But only static content shows in the pop-up, not the linked dynamic custom fields. Clearly it's worked for some of you though, so hopefully I can figure this out! Thanks for the tutorial either way Hugo!

[@lvh598]

@@adamcook446 Have you found a solution for this?

[@Famous-Nondelerious]

Great tutorial, it works, but when I add another listing on the page that needs to make use of the popup , well even on another page... those stay blank??

[@Will-nf9os]

Brilliant tutorial, any idea how to add "NEXT" button on popup open, so the next button can show next item in the listing without having to close the popup, so users can view the listing next & previous while popup is active?

[@jobinjosev7422]

Hi Hugo Nice one but, How can I show the repeater field values inside the jet pop-up, I have to display only 2 values from a custom post type, I created the listing and all but, when I add the dynamic text inside the pop up nothing showing

[@ΟΡΕΣΤΙΣΜΑΚΡΙΔΑΚΗΣ]

Hey Is there a chance that this works with elementor loop grid?

[@matrixworld9841]

thank you

[@hugomakes]

You're welcome

[@yasararafatha8365]

Thank You

[@hugomakes]

You're welcome

[@magino_mmt]

I like the solution and tried to implement it but my client was thinking that it's too slow for the loading time, is there a way to make it more efficient, as fast as a normal popup? Thanks!

[@hugomakes]

Unfortunately we are at the mercy of these plugins. What may look like a delay is that the data is being pulled via ajax on pop-up click. For me is pretty fast, so you can try a few things. 1. Enable caching on the website if not already doing so. 2. Make sure have a really fast hosting company such as cloudways. 3. You can also opt out of using the Crocoblock pop-up, and instead hand code that particular area of the site so that it pulls the pop-up information at the same time as the grid so this way it is already loaded into the browser and so it feels less slow. First I would try the caching and overall making sure your client is using a fast host since that will just make the experience overall the best.

[@yoonssam_kr]

is it possible to add a shortcode inside the popup? I would like to make the shortcode dynamic.. I have tried it but it doesnt seem load the content.. not sure what I missed

[@hugomakes]

Yes you are able to use short codes in Elementor popups.

[@hugomakes]

Feel free to post questions below and I'll do my best to answer them! 💥

[@cooleb4500]

Hey Hugo, thanks for the tutorial. That´s what i needed. Anyway it doesn´t work for me. It doesn´t show custom fields in the front end, when i use the popup. With single post it works fine... Do you know where should be a problem, please?

[@adamcook446]

@@cooleb4500 Yea I'm having the same problem here. Haven't figured out a solution yet

[@gabayroi]

tnx

[@hugomakes]

of course! thank for watching :)

[@qinpra]

Hi, thanks for the explanation, but does that "team" post was a custom content type? Or a custom post type? Thanks in advance.

[@qinpra]

Nevermind. I missed it when you mentioned it on the video. It's a CPT. Thank you!

[@hugomakes]

Custom Post Type

[@AshCampbell]

Just followed this twice, the dynamic content doesnt pull through at all. Each step perfectly brought over, switch dynamic content off, works. Very frustrating

[@pusuluri27]

how to work this with elementor popup builder?

[@bhavyamarwah5478]

Can this be done free of cost

[@hugomakes]

You can do it without paying anything using code. You can use ACF Free version depending on the field types you plan to use. But you are still required to use Elementor Pro to build the dynamic grid and if you want to do custom code JavaScript implementations to pull the card into a popup.

[@rodolfonakakubo]

Hi Hugo, Is it possible to open a jet popup with dynamic content from a custom post triggered by a text link? I'd like to trigger pop-ups with dynamic "more info" content. The tutorial with listing grid trigger worked fine, thanks!

[@hugomakes]

If I understand correctly you want to just trigger a pop-up in a custom post page (like inside a detail team member page or a property listing page or something like that) is that correct?

[@rodolfonakakubo]

​@@hugomakes I have "More Info" custom posts for technical entries and I'd like to open the technical entry in a dynamic popup triggered from a text link on another page/post. Basically the popup shows the definition or concept about the original word / link.

[@hugomakes]

Ok so the more info link is on another page, and the technical pop-up is a separate page (like an archive page or a page that has the listing grid). You want to open the pop-up with the dynamic content in that listing grid from another page. Let me know if that's what you're looking to do.

[@somelethalart]

Hello. Anyone had a solution to remove that preloader for popup and instead use a loader inside the popup content until the ajax loading completely? Thanks!

[@hugomakes]

You would need to use JavaScript event listeners for that. If you don't know Javascript, you can try querying Elementor AI to see if it will write something for you. Might be worth a shot.

[@rightpadding]

Can it be done now with Elementor's built-in Loop Builder and Popup builder? Or without using Jet Popups?

[@hugomakes]

Not at this time unfortunately!

[@franktielemans6624]

yes ElementHow has a tutorial about that.

[@konstantinoslalaounis2127]

@@franktielemans6624 can you send a link? i cant find it..

[@oe-pm6bz]

@@franktielemans6624 hey, can u link it please? how to integrate AFC to a popup? because my issu is that the information of the ACF doesn't show when i open the popup

[@ryankramer]

@@franktielemans6624 True, but they charge a minimum of $40 for the code to copy paste. Might as well pay for the Jet Popups.

[@siamurmahin6495]

hii, after click button, Dynamic data not showing in popup.

[@hugomakes]

Hi, can you provide a bit more context so i know where exactly you are on the tutorial? Make sure you're using the Crocoblock popup, not the Elementor one.

[@SalamatTussupbekov]

How to get a single post open as a popup?

[@hugomakes]

You can just create a simple singular popup for that without the need for the listing grid.

[@nyangkoo]

@@hugomakeshi, can you elaborate? How do you connect the button on the loop card to pull the dynamic content in the popup though?

[@manueld7643]

'promo sm' 😄

[@andreasotodelgado933]

thank you

[@hugomakes]

You're welcome