How do I edit the shop page, and how do I edit the header to be blurry like apple's website?

[Peter789]

1. Question: (Shop Page)

I want my products to be displayed like the cube in this example: https://prnt.sc/tj4r7h

This is how my shop product page looks like and I don’t even know how to edit it since it is from the “crafty” theme: https://prnt.sc/tj4rsk

2. Question: (Header)
How do I create my header bar to look blurry like apple’s website, I believe it is Gaussian blur? I want it to look like this: https://prnt.sc/tj54hz

This is how it looks on my website: https://prnt.sc/tj54s3

Can you please explain it to me so it is easy to follow the steps since I am new to this?

Kind regards

[ruenel]

Hello Katarina,

Thanks for writing in!

1.) Having your products displayed like a cube requires photo editing. Perhaps this video may help you:

• https://www.youtube.com/watch?v=G8-HFBDQZ68

2.) You will need to apply a custom CSS to one of the bar background element. Perhaps, this link might help you understand about the blur CSS property:

• https://www.w3schools.com/howto/howto_css_blurred_background.asp
• https://developer.mozilla.org/en-US/docs/Web/CSS/filter-function/blur

Note: We are unable to provide support for customizations under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One or Care service for further assistance.

Best Regards.