Background Color on Nav menu

ewestmoreland · ‎04-20-2024

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

PageFly-Amelia · ‎04-20-2024

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!

➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)
➜ Weekly updated Shopify tutorials on YouTube

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

TerenceKEANE · ‎04-21-2024

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.

<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!
★ Get skilled Shopify developers at BUDGET-FRIENDLY RATES — explore Novajetsoft.com for a rapid quote!
☕ 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

Background Color on Nav menu

Background Color on Nav menu

Community Blog Articles