Please follow the steps below to change the CSS for the footer:
1. Open the “basic-style.css” file using Notepad. The file is located in “templates/default/css.”
2. Locate this code:
.footer {
background: none repeat scroll 0 0 rgb(237, 237, 237);
border-top: 8px solid #ccc;
clear: both;
display: block;
width: 100%;
}
.footer h3{
font-size: 1.5em;
line-height: 1.2;
margin-bottom: 20px;
text-transform: uppercase;
color: #6b6b6b;
}
3. Directly update the CSS to reflect your own footer style as shown above. You need to be familiar with CSS in order to update this.
For more information about CSS, please refer to:
http://www.w3schools.com/Css/default.asp
For example, if you wish to change the background color of the footer so that it will have a black background color, then please update the CSS as shown below:
.footer {
background: none repeat scroll 0 0 rgb(237, 237, 237);
border-top: 8px solid #ccc;
clear: both;
display: block;
width: 100%;
background-color:#000000;
}
4. Save the file and upload to the “templates/default/css” folder.
Preview before the changes:
After changes:
NOTE: The preview shown above is just an example of how to change the background color in the footer. You can, of course, change any of the CSS codes to create your own style.