How to Move Justuno Designs Behind Site Elements Like a Mini Cart

If your Justuno design is appearing on top of important site elements like a mini cart, chat widget, or navigation menu you can easily adjust its position by lowering its z-index. This ensures your on-site experience remains seamless and your custome

Why This Happens

Justuno designs are embedded as floating iframes, which means they overlay your site content. By default, we give them a high z-index to make sure they’re visible above other elements—but sometimes, you may want to move them behind certain parts of your site.

How to Adjust the Z-Index of Justuno Designs

To move Justuno designs behind specific site elements, you can add a small snippet of CSS to your Justuno account’s custom code area.

Here’s how:

✅ Step 1: Copy the CSS Code

[id^="_jst-iframe-"] {
  z-index: 10;
}

This code targets all Justuno design iframes and lowers their z-index to 10placing them behind most high-priority site elements like your mini cart or sticky headers.

✅ Step 2: Add the Code in Your Justuno Account

1. Log in to your Justuno account.

2. Go to Advanced Settings.

3. Scroll down to the Custom Code section and click the [open code editor] button.

4. Paste the code snippet above into the CSS panel.

5. Click Save.

Once saved, your Justuno designs will now appear behind other elements on your site that have a higher z-index.

Still Seeing Overlaps?

If specific elements are still being covered:

• Double-check the z-index of the overlapping element in your site’s CSS.

• Try adjusting the z-index in the snippet to a lower number (e.g., z-index: 5) to push Justuno further back.

• Reach out to your web developer or use browser dev tools to inspect and troubleshoot layering conflicts.

Need Help?

Our support team is happy to assist! If you’re unsure which value to use or where to apply the changes, feel free to contact us