NO BUG: Popup slider always loads images from first post of first category

[Jokingmind]

Good morning,

I’m experiencing an issue with a slider inside a popup: it always loads images from the wrong post.

Project context:

• Series of CPTs (pastry recipes) divided into 4 categories
• Each CPT has custom fields for: information, ingredients, nutrients, and photo folder ID
• Using Happy Files to organize images; the generated folder ID is manually inserted into the CPT’s custom field

Page structure:

• 4 cards-grids generated with query loops (one per category)
• Outer loop: retrieves the category
• Inner loop: populates the grid with posts (card containing featured image and title)
• Click on card → popup opens

The problem:

In the popup:

• The info (from Custom Fields) displays correctly ✓
• The slider always loads images from the first category ✗

Example: clicking on the first post of any category, the slider always shows images from the first post of the first category.

Technical settings details.

The cards-grid page with nested loops

Card loop settings

Taxonomy query associated with the loop

The popup

General query settings

Taxonomy query settings

Here you can check the results:

Pasticceria

If you click the first item of the third row, the popup shows the slider from the first item of the first row.
If you click the third item of the third row, the slider is correct.
This makes me think there’s a failure in updating the slider.
The number below the cards simply represents the folder ID and serves to confirm the data is correct.

Maybe is not a bug but just a misconfiguration of my settings (I’m pretty new to Bricks)

Last image, the devtools Inspection. It may help

Thank you
Davide

[Matej]

Hi @Jokingmind,

this is quite a setup . Sadly, I don’t see the example page - I believe I get redirected to the “coming soon” page, or the gallery is not there anymore.

So, the first thing that comes to my mind is that the popup template setup may be wrong.
Make sure that the popup template is INSIDE the query loop: Popup Builder – Bricks Academy or if it’s Ajax based, then make sure that you pass correct context ID.

Let me know please,
Matej

[Jokingmind]

I checked the link you sent me. The structure looks correct to me (see image 1). I also moved the interaction to the block that generates the query loop - previously it was on the image - but the result doesn’t change.

However, I’ve created a new test page called “Pasticceria Test” where I removed the nested loop structure (Categories loop + Posts loop per category) and replaced it with a single loop across all categories. In this case, the popup works correctly.

Since the site needs to be fully operational within one to two weeks at most, and my client has purchased a lifetime license, I was wondering if it would be possible to get assistance from support.

Thank you
Davide

[Matej]

Hi @Jokingmind,

now I was able to access the page and I can see the issue. If I click the first item in the third row, the images will be from “Crostata Cioccolato e Nocciola” (first item in first row).

Can you try the following settings with the popup:

1. Set the popup to “Fetch content via AJAX”
2. Add “Context ID” to the interaction that will open the popup → if the popup is TERM, then it needs to be term_id.
3. Once you set up the above, and it’s still not working, try to move the popup element outside of the query loop.

For the email support, please ask the client (license owner) to email us at help@bricksbuilder.io to confirm your email address (as you are his dev), then we can assist you over email as well.
The client should ideally include a link to this topic, so that we know what the support is about.

Thank you,
Matej

[Jokingmind]

Hi Matej!
I tried the solutions you suggested, but none of them produced the expected result.

If I fetch the content via AJAX, setting context ID: post and post_id, it doesn’t even load the photos. If I then move the popup outside the div that generates the loop, the result is even more bizarre: it seems not to load the slider at all, unless I click outside the popup.

At the moment, on the test site, the settings are as you requested, so you can see the result.

In the images, some of the settings I changed

Thank you!
Davide

[Matej]

Hi Davide,

thank you for the update. I can see the issue on your website, and I’ve tried to replicate it locally, but I can’t. It would be very useful if you asked the client to confirm your email address, and after that, you can send login to the staging website, so we can take a look.

Would that be possible?

Thank you,
Matej

[Jokingmind]

Yes, sure.
I was still using the forum to just help other people with same issue.

Thank you
Davide

[Jokingmind]

Email sent
Thank you

Davide

[Matej]

Hi @Jokingmind,

can you share where you sent the email and what the subject name. I don’t see it

Matej

[Matej]

Hi there.

Just a promised update that we discussed over email, for anybody reading this topic in the future.
The changes were:

• Set popup to fetch content as AJAX
• Remove the popup template from the query loop and set a popup condition to load on the page
• Use “Image” element instead of background-image on the popup.

That’s it. The user confirmed that it’s working now.

Best regards,
Matej

[Jokingmind]

One more little thing.
Don’t forget to add these settings to the interaction that triggers the popup:
Context Type: Post
Context ID: post_id