Results 1 to 7 of 7
  1. #1
    Join Date
    May 2009
    Posts
    66
    Plugin Contributions
    0

    Default Change background color behind product listing and on product info page

    zen version 1.58
    php 7.3
    Template: Bootstrap v3.5.0

    I want to change the template to a dark mode setup. I have most of it accomplished but can't seem to find out how to change the product listing page color behind the products. I also can't change the background colors behind the attributes areas. The attached photo shows what i am trying to accomplished. FYI: The example photo that has "CHANGE TO.." is in a browser where I have dark mode enabled. It's really white in visitors browsers.

    I have gone through all of the bootstrap colors settings these don't seem to have a setting that can be changed.

    I have tried looking in inspector in the browser. I have found areas that have colors to change but I don't know what file they are in;

    centerBoxContentsListing
    Atrributes-card
    .custom-select
    form-control-disabled

    Thanks for your time.
    Attached Images Attached Images  

  2. #2
    Join Date
    Jan 2004
    Location
    N of San Antonio TX
    Posts
    9,103
    Plugin Contributions
    11

    Default Re: Change background color behind product listing and on product info page

    You'll want to go to the last item in the Admin .. Tools menu.

    Since you are wanting it all the same color, I would start with editing Body Background Color first AFTER you have downloaded a CSV of your current settings. That gives you a backup when Murphy stikes.

    ALSO, make sure you have a good contrast between the body and the text. Contrast Ratio: Easily calculate color contrast ratios. Passing WCAG was never this easy!

  3. #3
    Join Date
    May 2009
    Posts
    66
    Plugin Contributions
    0

    Default Re: Change background color behind product listing and on product info page

    Quote Originally Posted by dbltoe View Post
    You'll want to go to the last item in the Admin .. Tools menu.

    Since you are wanting it all the same color, I would start with editing Body Background Color first AFTER you have downloaded a CSV of your current settings. That gives you a backup when Murphy stikes.

    ALSO, make sure you have a good contrast between the body and the text. Contrast Ratio: Easily calculate color contrast ratios. Passing WCAG was never this easy!
    Thank you for your response. I have already made the change in ZCA Bootstrap Colors to the Body Background Color" field. It didn't change the parts i describe in my initial post so I am trying to find where to change them. It doesn't appear that ZCA Bootstrap Colors is set to change those areas so I need to know where they are. I mentioned in my initial post the areas I was able to identify but they are not in the stylesheets

  4. #4
    Join Date
    Jan 2004
    Location
    N of San Antonio TX
    Posts
    9,103
    Plugin Contributions
    11

    Default Re: Change background color behind product listing and on product info page

    Keep working your way down the list. Bootstrap has other options later on the list that "sit on top of" the body. Whatever color is the last "on top" is what the customer will see. That's why you may often see a website start out white, flicker, and end up with a different color or image.

  5. #5
    Join Date
    Nov 2022
    Posts
    15
    Plugin Contributions
    0

    Default Re: Change background color behind product listing and on product info page

    Did this ever get solved? Running into the same issue right now. Thanks!

  6. #6
    Join Date
    Sep 2009
    Location
    Stuart, FL
    Posts
    12,366
    Plugin Contributions
    87

    Default Re: Change background color behind product listing and on product info page

    Quote Originally Posted by NortheastTroller View Post
    Did this ever get solved? Running into the same issue right now. Thanks!
    I dunno. Since the post (last year) wasn't placed in the template's support thread (https://www.zen-cart.com/showthread....Support-Thread), I missed it.

    I'll note that various changes have been made to the template since v3.5.0 (https://github.com/lat9/ZCA-Bootstrap-Template/releases). If you head on over to the template's support thread and let me know what the problem is (I can't decipher what this means) and the versions of Zen Cart and Bootstrap that are in use, I'll be happy to help.

  7. #7
    Join Date
    Nov 2022
    Posts
    15
    Plugin Contributions
    0

    Default Re: Change background color behind product listing and on product info page

    Quote Originally Posted by lat9 View Post
    I dunno. Since the post (last year) wasn't placed in the template's support thread (https://www.zen-cart.com/showthread....Support-Thread), I missed it.

    I'll note that various changes have been made to the template since v3.5.0 (https://github.com/lat9/ZCA-Bootstrap-Template/releases). If you head on over to the template's support thread and let me know what the problem is (I can't decipher what this means) and the versions of Zen Cart and Bootstrap that are in use, I'll be happy to help.
    Ok Thank you, Ill make a post on the support thread. If you scroll to the OP you will see pictures describing what they're looking to change and cannot. It looks like its an inherited #fff color code that isn't overridden by bootstraps Body Background Color chooser.

    Thanks!
    C

 

 

Similar Threads

  1. v150 Can I change the category and new product list font and background color?
    By soso838 in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 11 Jun 2012, 06:55 PM
  2. Change the font color in Product Listing page
    By wilson_li in forum Templates, Stylesheets, Page Layout
    Replies: 27
    Last Post: 8 Aug 2011, 06:56 PM
  3. Product Listing Page - Model Number - Need to change color
    By beyre in forum Templates, Stylesheets, Page Layout
    Replies: 5
    Last Post: 24 Feb 2010, 12:30 PM
  4. Change background color on index and product listing to transparent
    By domifix in forum Templates, Stylesheets, Page Layout
    Replies: 7
    Last Post: 23 Jul 2009, 06:48 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg
Zen-Cart, Internet Selling Services, Klamath Falls, OR