Goal: Apply a true blur effect to the background behind a drawer menu (slide‑out menu) in Shopify, not just a semi‑transparent color overlay. The desired result is that the area behind the opened drawer appears as a blurred version of the underlying page image.
Context: The original poster shared a live preview link and a reference image illustrating the target effect. These assets are central to understanding the visual outcome sought.
Update: Another participant asked for progress, noting they achieved the blur in the header but could not get it working for the drawer menu specifically.
Outcomes/decisions: No code, steps, or confirmed solution were provided. No theme details or technical constraints were discussed.
Status: Unresolved and open. Key unanswered question: how to implement a blurred background specifically for the drawer menu area in Shopify.
Hello, good luck everyone!!
Is there any possibility to make the background of the drawer menu blurred? I’m not talking about a single colour and changing the opacity. I want the part where the menu opens to be a blurred version of the photo on the back. I would appreciate your help, I appreciate it in advance. I send you the link to my page and a sample image of what I want.
https://mewhctlr3qbp8mhw-85574287682.shopifypreview.com
This is wat I want:
Any luck? Trying to do the same. Managed to get it in the header but not the drawer.
