Background Color on Nav menu

ewestmoreland
Shopify Partner
3 0 0

Client needs background of the nav menu drop down on mobile to be their color FBF8F3.  it is now White. 

Pool Goods | Quality Pool and Spa Products Shipped to Your Door

 

They are also asking if we can remove the white background on images that are preloaded...and I am not sure how to do this on several images.  I have no idea how many there are:

Here is a screenshot.  I need to make all the images have transparent backgrounds I guess.  They want all to look like the yellow arrow. THANK YOU IN ADVA

ewestmoreland_0-1713663902068.png

 

Replies 2 (2)

PageFly-Amelia
Navigator
344 104 147

Hello @ewestmoreland 

This is Amelia at PageFly - Shopify Advanced Page Builder app.

 

I have checked for you, and the reason the current image is white is because the original image has a white background. Therefore, when displayed, the background will be white like the original image. And it is not possible to change the background color of the original image using code. You can fix this by using a different image with a transparent background or a background color that you want.


Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.


Optimize your store’s mobile shopping experience with the Blum theme.

TerenceKEANE
Shopify Partner
395 74 67

Hi,

 

You can only solve the image issue if you upload it in "png" format with a transparent background. As for the mobile dropdown menu, the following will suffice.

You can change the values as you like. If you encounter any issues again, feel free to write, I'll help.

 

1) Navigate to the 'Edit Code' option in your theme settings, then search for 'theme.liquid' in the search bar.

2) Paste the following code below the '<head>' tag. Please refer to the attached screenshot for guidance.

 

shopify.head.jpg

 

<style>


@media (max-width: 749.98px){
  nav.menu-drawer__navigation {
    background: #FBF8F3 !important;
}

}


  
</style>

 

Terence

★ Looking for Dedicated Premium Coding Support? Join our unique "PREMIUM SUPPORT" service starting at 59 USD for 1 MONTH!
★ If I helped you, Please don't forget to Like and Mark Solution to the post that helped you. --> Our Website
If my support was a lifeline for you, The COFFEE   would be the anchor keeping me steady!
★ For Quick response --> WhatsApp | Email --> info@novajetsoft.com | Software Engineer - Specializing In Advanced E-Commerce Websites