How can I add a drop shadow to the header line?

Store Design
1

Hi, id like to put a drop shadow below the red seperator line on the header, does anyone know how to do that?

Here’s the link to my store!
https://sonic-weaponry.com/products/glitched-out-slammers

2

Hi @sonicweaponry

I’m Richard Nguyen - CRO Expert at PageFly- Free Landing Page Builder.

You can try with this code.

Follow this:

Go to Online Store->Theme->Edit code->base.css ->paste bellow code in bottom of file

.header-wrapper, .footer-wrapper {

box-shadow: 10px 10px 10px red;

}

it will look like this: https://prnt.sc/U_ZCBuda3_Sj

If you feel my answer is helpful, like it or mark it as a solution. Let me know if you have any questions.

Best regards,

Richard | PageFly

3

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset >base.css and paste this at the bottom of the file:
.header-wrapper, .footer-wrapper {
box-shadow: 0 8px 5px -8px #ff0100;
}

Screenshot :- https://prnt.sc/qo5GyXOg1pwj

4

Thank you! Is it possible to have this be the same on the footer as well with the border line?

5

@sonicweaponry
Yes, you can try with this code:

@media screen and (min-width: 750px)
.section-template–15634053333192__newsletter-padding {
box-shadow: 10px 10px 10px rebeccapurple;
}

hope it’s useful.

6

this gave me the border but not the shadow! Thanks for the help though!

7

Actually I dont think it worked at all I just realized, it worked for the header but not the footer

8

thank you for this information!