How do I change background color on my product page, checkout page and blog to white with black text

[HTHhelp]

So, I originally chose my theme because I like the basic black navigation bar with main content area with white background and black text. I assumed my blog and product page (along with checkout) would be the be same.

Turns out its complete opposite of my other pages with black background and white text which is really hard to read. I've tweaked the blog to have a white box/black text. It loses that clean simple look that you get with a solid white background. 

How do I change background color on my product page, checkout page and blog to white with black text so it reads cleaner?

[Adam7]

Are you familiar with HTML and CSS, @HTHhelp? It might be possible to customize those colors via CSS changes, although I wouldn't recommend something like that unless you're familiar with HTML/CSS.

[HTHhelp]

Depends on the extent as I've been playing around with CSS in the Settings / SEO / Header. I'm "familar". Is there a CSS code that can be entered in there?

Yes, please post any CSS code. If I can't do it, I know someone who can help me.

Thanks

[Adam7]

Ok. What is the address of your site?

[HTHhelp]

Hi Adam,

It's www.hellotherehuman.com

[BJ5]

Add this settings > seo > header code and it should get you white w/ black text (live site only):

<style>
    .main-wrap
    {
        background: #FFF !important;
        color: #000 !important;
    }
    .main-wrap a
    {
        color: orange !important;
    }
</style>

[HTHhelp]

Thanks Adam, 

We're getting there. Happy with the Blog Page. But for the product page and checkout page it looks like it made the background white but it only changed "some" of the text to black. The product title and description text is still white,  and then under "size", "choose your visitor" and "quanity" it doesn't read. Some of the text changed and some didn't. Same on the Checkout Page, some text is still white. Also the button is still white.

Do you have an extended code to help with that?

Thanks again, 

Julia

This is what I'm looking at

https://www.hellotherehuman.com/store/p2/hello-there-human-tee.html

[Adam7]

Thanks for helping, @BJ!

[BJ5]

Cool, glad that worked. Try this code instead to change that text to black:

<style>
    .main-wrap, #wsite-com-product-area
    {
        background: #FFF !important;
        color: #000 !important;
    }
    .main-wrap a
    {
        color: orange !important;
    }
</style>

[HTHhelp]

Hmmm....still no luck. I plugged that in the SEO / Header Code

Again, I'm getting the white background that I want but for some reason not all the text has changed to black. So you can't read the Tshirt "Title", "Description", the shirt "size" choice, "Choose Your Visitor" choice,"Quanity" number and the "Add to Cart" button are all still white. 

Here is the same page I'm looking at https://www.hellotherehuman.com/store/p2/hello-there-human-tee.html. 

To see what is happening, go under "$25.00" and highlight the text and see what is still is still white. 

I wonder if there is an overlapp between the "Stripe" portion of the site with the "Weebly" (if that makes sense)

Anyway, let me know if this is fixable and if there is another mysterious code that may be used. I'll settle with an orange background when all is done is said if we don't have any luck, but of course, would really like a basic white background with black text which I assumed would have been consistent throughout the chosen theme.

Thanks again for helping me trouble shoot this. 

Julia

[HTHhelp]

Alright, I'm not having luck with the CSS codes changing color of background and text on both blog page and store. So, with that, l do have to vent here for a minute as I've noticed many others have posted their frustrations regarding limited ability to change colors on Blog and Product Pages (with forums complaints since 2016). It's not just me.

Again I selected simple white background with black text as my theme, BUT for some reason the blog and the product page and checkout are the complete opposite with Black background with white text (which does not read well and is not inviting..feels dark and menacing.

Please gather your team together and make this fix.

Anyway, I going to make the best of the site for now as I've invested a lot of time and money, but will definitely be considering competitors services for future website projects unless things are addressed.

Thank you,

Julia

[harymarris]

I agree Julia!  This has gone on too long for them to not fix.  I've had trouble for a year with this.  Now that I'm officially launching, it's an embarrassment that customers can't even read the product info.  I too am looking into changing.  I have gotten no assistance from Weebly - trying to call but need an 8 digit code.  Very unsettling after all the work put in.  I purposely began building my site a year before launch so it would be ready to go but here I am, still struggling with this one issue.

[Adam7]

If you want to call our support team, you can get that PIN number via our support site @harymarris. The article on how to contact Weebly has steps to follow to get the PIN.

[harymarris]

Not trying to be a winer here but even contacting someone is an arduous process.  User friendly folks!

[harymarris]

This is what comes up when I click the link.  Please......

It is the Square support center, talks about Covid, says the call volume is extremely high right now and then is just general mishmash.  In the help bar, I put in, 'get and pin for help and am not seeing what I need.  Isn't 'Square' if you have that app to get people to pay through that?  I'm not there yet.  I need to talk with someone from weebly and I need instructions - not links to confusion - to be able to resolve some of these issues.  Can you please at least copy and paste the instructions?  And why isn't contact info right on the page we work from so we don't have to jump through all these hoops?  Come on!  It's taking me days to solve what should be simple issues.

[Adam7]

Oh, you're right - we moved a lot of the Square Online Store content over to the Square support site to make it easier and then added a forward for Square Online Store people. There are some store owners who signed up through Weebly like yourself who will see that. I'll send you a PM to follow up, @harymarris.

[GOH]

Hi, I'm having the same issue and have used this code which has worked so thank you for posting it. This is really an off putting issue with Weebly for shops.

My only problem now is that the buttons for quantity and add to cart are very hard to read, they disapear when you hover over them. I wonder if you could help?

This is my page: https://www.withinthewallsyork.com/store/p5/Heart_of_Yorkshire_T-Shirt.html

[harymarris]

So Adamm

how are we supposed to make our product info show?  Why is the color not editable?  Why can't anyone from there help us?  We went to this 'do-it-yourself' website and paid for it because we don't know how to code it ourselves.  So, aside from redoing our whole themes - which works well on every other page, what is the solution here?  I see from various searches that this is not a new problem with Weebly but has been going on since at least 2015!  So why haven't you addressed this?  No!  I, and likely many other CUSTOMERS are not familiar with HTML or CSS.  You ask if they are but say you wouldn't recommend it anyway.  So, please!  What solution do you have - aside from changing our theme?  It should be a simple coding issue that should take place on your end or platform end.