Okay
  Public Ticket #3004042
Product-category page header background color
Closed

Comments

  •  12
    tombeckham started the conversation

    Hi Team,

    Working with the Ultimate ecommerce demo as a starting place, I see on product-category page headers there is this background color on the header. (screenshot)

    Its a problem, and I want to remove it and replace it with a simple image. I found that I can upload an image via the "products>categories" area and selecting the chosen category and uploading an image (screenshot).

    Where I have a problem is that when I succesfully upload my header image via the products>categories area, I get my image to appear, but it still has an overlay of the color somehow applied to the image I uploaded. If I delete the image then it reverts back to the baby blue color / if I upload the image and apply it then I get a baby bnlue overlay on my inage. 

    I cant figure out where in the interface to deselect and set the color to none. I see it in inspector. (screenshot)

    thanks! 

  •  1,877
    Judith replied

    Hello Tombeckham,

    Thanks for keeping in touch.

    Please send in your website url so that we can provide css for it.

    Thanks.

  •  12
    tombeckham replied

    Since the site is being developed locally, I can't share a live url yet. 

    Can you look at your ultimate e-commerce demo page and see the same place i was asking about:

    https://themenectar.com/salient/ecommerce-ultimate/product-category/casual-shirts/

    You can replicate what I'm experiencing by going to the Products>edit category>category header image

    and upload a header image - you will see that there is some kind of blue haze over the image. 

  •  1,877
    Judith replied

    Hi There,

    Please try out this css:

    body[data-header-resize="0"] #page-header-bg {
        background-color: #eaf0ff00 !important;
    }

    Thanks.

  •  12
    tombeckham replied

    I tried that and it had no effect.

    I did note the the unusual markup for this element (see underline in screenshot): style= " /* ! background-color:  #eaf0ff; */


    and noticed that when i rollover the image in inspector it shows the true color of the image against the muted overlay color depicted in the browser. 

    if we can't get it in pre, then I'll send this again once it's a live link, but i do appreciate your efforts... perhaps you have another idea?

     thank you

  •  1,877
    Judith replied

    Hi There,

    I think I will be able to send a more accurate response once I receive your url. Please let us know once the site is up.

    Thanks.