Jump to content



Photo
- - - - -

Changing font or background colours on Checkout_confirmation


Best Answer frankl, 17 February 2017 - 03:32

Duke St is in Forestville, not "Sydney" ;)  (I grew up 2 streets away which is why I know lol)


Anyway, add the following code in user.css:

.panel-warning > .panel-heading {
  color: #8a6d3b!important;
}

which will change the colour of the text in panel-warning headings throughout your shop (which would be a good idea).

 

You can change the #8a6d3b to whatever colour you like.

Go to the full post


  • Please log in to reply
15 replies to this topic

#1   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 17 February 2017 - 01:52

Hi guys, we have a light background, dark box header style on our new site, but the Pay Pal boxes on the checkout_confirmation then become unreadable, see attached:

 

Is it possible to change the font or background colour of the headers of those specific boxes in BS Oscommerce so they become readable?

Attached Files



#2 ONLINE   frankl

frankl

    One of the originals...

  • Community Sponsor
  • 463 posts
  • Real Name:Frank
  • Gender:Male
  • Location:Sydney, Australia

Posted 17 February 2017 - 03:32   Best Answer

Duke St is in Forestville, not "Sydney" ;)  (I grew up 2 streets away which is why I know lol)


Anyway, add the following code in user.css:

.panel-warning > .panel-heading {
  color: #8a6d3b!important;
}

which will change the colour of the text in panel-warning headings throughout your shop (which would be a good idea).

 

You can change the #8a6d3b to whatever colour you like.


Let's make things easier for new osCommerce users http://forums.oscomm...bles/?p=1718900  Getting there with osCommerce 2.4! :thumbsup:


#3   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 17 February 2017 - 10:18

Haha, see - that is part of my complaint about PayPal express, that it does not put the correct address in when used. I can guarantee you that Forestville is in that address in PayPal.

#4   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 17 February 2017 - 10:25

Ty for the tip, I thought I'd tried this and it didn't work but I will try again.

#5 ONLINE   frankl

frankl

    One of the originals...

  • Community Sponsor
  • 463 posts
  • Real Name:Frank
  • Gender:Male
  • Location:Sydney, Australia

Posted 17 February 2017 - 10:29

@Sam-AUST

 

I tested the css change and it worked fine. You may need to clear your cache to see the change.

 

As for the Paypal address, are you grabbing the second address line from Paypal? If not remind me on Monday to give you the change to make in the relevant file.


Let's make things easier for new osCommerce users http://forums.oscomm...bles/?p=1718900  Getting there with osCommerce 2.4! :thumbsup:


#6   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 17 February 2017 - 10:50

I thought I was as I'm sure I had that change made months ago. Now I'm not so sure, hehe

#7   John W

John W

    Woof Woof!

  • Community Sponsor
  • 580 posts
  • Real Name:John W.
  • Gender:Male
  • Location:Orlando, Fl

Posted 17 February 2017 - 15:23

This is how I did it to change my panel heading background and I also use white lettering.

.panel-heading {
  background-image:linear-gradient(180deg,#96a984,#597532);
}

I'm not really a dog.


#8   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 19 February 2017 - 03:03

@frankl I just did it and it changed the billing address header and payment method but not the ones with the blue background (delivery address and shipping method).



#9   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 19 February 2017 - 03:07

Got it Frank, I darkened the light blue of those sections so the creamy colour text shows up.

 

Why must I work with these earthy colours? LOL



#10 ONLINE   frankl

frankl

    One of the originals...

  • Community Sponsor
  • 463 posts
  • Real Name:Frank
  • Gender:Male
  • Location:Sydney, Australia

Posted 19 February 2017 - 07:51

@Sam-AUST

 

Can you post a screenshot of the new colours?


Let's make things easier for new osCommerce users http://forums.oscomm...bles/?p=1718900  Getting there with osCommerce 2.4! :thumbsup:


#11   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 20 February 2017 - 05:13

@frankl here you go!

 

I should probably have done that with the address in the first one LOL

Attached Files



#12 ONLINE   frankl

frankl

    One of the originals...

  • Community Sponsor
  • 463 posts
  • Real Name:Frank
  • Gender:Male
  • Location:Sydney, Australia

Posted 20 February 2017 - 05:44

@Sam-AUST

 

So you darkened the blue and also darkened the text in the cream coloured headers. That looks much clearer.


Let's make things easier for new osCommerce users http://forums.oscomm...bles/?p=1718900  Getting there with osCommerce 2.4! :thumbsup:


#13   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 20 February 2017 - 12:59

Basically yes. It half kills me not having it all wooden tho LOL (bit overly dramatic but you know).



#14   John W

John W

    Woof Woof!

  • Community Sponsor
  • 580 posts
  • Real Name:John W.
  • Gender:Male
  • Location:Orlando, Fl

Posted 20 February 2017 - 14:13

Why not have all wooden panel headers since you use it on some?  I use my gradient green on all of mine because I like the uniformity.


I'm not really a dog.


#15   Sam-AUST

Sam-AUST
  • Members
  • 166 posts
  • Real Name:Sam M
  • Gender:Female

Posted 21 February 2017 - 00:00

@John W I don't know why but I couldn't get it to show on the shipping address/method boxes, nor the payment method etc boxes. Of course when I have a copy and paste knowledge of css, it doesn't help lol



#16   John W

John W

    Woof Woof!

  • Community Sponsor
  • 580 posts
  • Real Name:John W.
  • Gender:Male
  • Location:Orlando, Fl

Posted 21 February 2017 - 01:39

Hey Sam,

 

You might need to add "panel-warning" to your custom css, so like below.  It's been a while since I did it.  I also customized my bootstrap using the bootstrap customizer.

.panel-heading .panel-warning{
  background-image:linear-gradient(180deg,#96a984,#597532);
}

I'm not really a dog.