background color ?

The Background color of the main page is set to #FFFFFF - where exactly should I change it?

For example in the css file I could not find the general body background...

thank you!


  • You can change it on the body tag in css if you really want to. If it's important to you to have a different color, we can also break it out as a configurable option.

  • The body tag in /var/www/html/ca/pawtucket/themes/default/assets/pawtucket/css/main.css

    does not seem to correspond to the background of the default pawtucket theme - is it the wrong css file?


  • For the Pawtucket default theme that's the CSS.

  • Something strange:

    Although I am able to change the error page colors (with error.css) but when editing main.css nothing changes...

  • edited June 1


    maybe a delete on Pawtucket's cache directory content would fix it?

  • edited June 2

    Hi Baldrick,

    (A cool thing: if you use Firefox, you can use the web developper tools included in a menu, to explore CSS and code of your page.)

    In Pawtucket, you have 3 parts of the page where you can define a background color: the navbar, the container, the footer.

    To change background color of these parts, edit the /themes/YourTheme/assets/pawtucket/css/main.css file.

    For the navbar, search ".navbar", you should find this:

    .navbar {
    /* choose your color here: */
     -webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.3);
     box-shadow:0 1px 3px rgba(0, 0, 0, 0.3);

    For the container (in fact, the whole body), search "body" (at very beginning), you should find this:

    body {
       font-family: LatoLight;
       /* choose your color here: */

    For the footer, search "#footer", you should find this:

       /*margin:40px 0px 65px 0px;*/
       border-top: 1px solid #E3E3E3;
       color: #ababab;
       padding: 0px 15px 0px 15px;
       /* choose your color here: */
       background-color: #666666;

    Next, flush the cache of your navigator, and flush the cache files of Pawtucket (to do this, delete all files and directory inside the directory /app/tmp)

    In my example, I choose a light grey for the navbar, white for the container, and a dark grey for the footer:

  • thank you for the detailed reply!

    It worked!

Sign In or Register to comment.