Jump to content

Changing background colour


Recommended Posts

I searched the forums and saw people talk about changing the Global.css file. I tried to do this but have no idea which is the right parts to change. At the top of the file it says "background colour white" or words to that effect, surely changing that to other colour names isn't right, is it ? I thought it is all about F0000 and terms like that.

 

Also can I change both the outside colour and also the middle part of the theme too ? Any newbie basic solution would be appreciated, thanks :)

Link to comment
Share on other sites

You did not state your version which is always a good idea when asking for help, so the tip below is for 1.5

 

Yes you can change both but some modules backgrounds may need to be changed as well depending on your choice of colors..

 

To change the background outside page find the section heading, body and change the color, you can use standard colors like black, white, yellow or do a Google search for HTML color codes and you will find many sites listing them.

In the body section below the background color is white ie #fff.

when using color names do not place the # in front ie color:white

 

 

body{

font:normal 11px/14px Arial, Verdana, sans-serif;

color:#222;

background:#fff

}

 

To change the center of the page so the background does not show through you will need to add a color to the section below.

 

change this:

#page {}

 

To this:

#page {color:#fff}

 

 

You can also use an image file the file should be uploaded to themes/default/img and use this code instead of a color

 

 

body{

font:normal 11px/14px Arial, Verdana, sans-serif;

color:#222;

background:url(../img/yourimage.jpg) fixed;

}

 

background:url(../img/image21.jpg) fixed;

Edited by tdr170 (see edit history)
Link to comment
Share on other sites

There are small differences the body section is similar but uses white instead of #fff, however either will work.

 

The page section is different as you see below, but still needs the color added.

you will also need to add a semi-colon after the line before you add color as I did below.

 

Change this:

 

#page {

width: 980px;

margin: 0 auto 2px auto;

text-align: left

}

 

 

To this:

 

#page {

width: 980px;

margin: 0 auto 2px auto;

text-align: left;

color: whatever you choose

}

  • Like 1
Link to comment
Share on other sites

  • 4 months later...

You did not state your version which is always a good idea when asking for help, so the tip below is for 1.5

 

Yes you can change both but some modules backgrounds may need to be changed as well depending on your choice of colors..

 

To change the background outside page find the section heading, body and change the color, you can use standard colors like black, white, yellow or do a Google search for HTML color codes and you will find many sites listing them.

In the body section below the background color is white ie #fff.

when using color names do not place the # in front ie color:white

 

 

body{

font:normal 11px/14px Arial, Verdana, sans-serif;

color:#222;

background:#fff

}

 

To change the center of the page so the background does not show through you will need to add a color to the section below.

 

change this:

#page {}

 

To this:

#page {color:#fff}

 

 

You can also use an image file the file should be uploaded to themes/default/img and use this code instead of a color

 

 

body{

font:normal 11px/14px Arial, Verdana, sans-serif;

color:#222;

background:url(../img/yourimage.jpg) fixed;

}

 

background:url(../img/image21.jpg) fixed;

 

So, I have been trying for hours. I got my content (center) changed.. but can't get the main outside (body) to change even using your code suggestion. I am using 1.5.4 version.. click-for-site The site is still 99% factory theme. Theme name: BlackWhite

 

Also, not sure what section is just above the footer, but just below the content.. but can't get that flipped either.

 

Anyone willing to aid a newb website builder? :D

Link to comment
Share on other sites

  • 3 years later...

top menu colour is not changing in prestashop 1.6

 

public_html/themes/default-bootstrap/css/modules/blocktopmenu/css

 

 

 

 

 

.sf-menu {
  position: relative;
  padding: 0;
  width: 100%;
  border-bottom: 3px solid #e9e9e9;
  background: #f; }
  @media (max-width: 767px) {
    .sf-menu {
      display: none; } }
 
.sf-menu ul {
  position: absolute;
  top: -999em;
  background: #ffffff; }
  @media (max-width: 767px) {
    .sf-menu ul {
      position: relative; } 
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...