Hi guys I thought I had changed every colour but I had forgotten about the footer. I am trying to change the colour of the text in the footer and the background colour I can't find it in the stylesheet or footer.tpl in the common directory I wondered if anyone had any ideas?
Kind Regards
Tim
Just wrap all of code on footer.tpl using, for example:
then give it a style declaration on stylesheet
Hope it will help you 
Code: Select all
<div id="footer">Code: Select all
#footer { color: #070707 }Hiya
Thanks for your info unfortunately it didn't work i am looking to do the area around the paypal image and the powered by open cart text i want the text white and the background black any ideas?
Thanks for your info unfortunately it didn't work i am looking to do the area around the paypal image and the powered by open cart text i want the text white and the background black any ideas?
so if you want to do that, wrap footer on #footer (as I said before), for example:
To make all of your footer have dark background, and white text:
Or only specific to div under #footer
And if you want link also have white color
Try it
Code: Select all
<div id="footer">
<div class="div1">
<a onclick="window.open('https://www.paypal.com/uk/mrb/pal=W9TBB5DTD6QJW');">
<img src="catalog/view/theme/default/image/payment.png" alt="" />
</a>
</div>
<div class="div2"><?php echo $text_powered_by; ?></div>
</div>
Code: Select all
#footer {
background-color: #000;
color: #fff;
}
Code: Select all
#footer .div1, #footer .div2 {
background-color: #000;
color: #fff;
}
Code: Select all
#footer a {
color: #fff;
}
Hi thanks for the this the div for the left and right are in black now with white text but the middle is white still and I can find the section in the style sheet to change that. I am attaching a image to show you what I mean.
Thanks again for all of your help.
Kind Regards
Tim
Thanks again for all of your help.
Kind Regards
Tim
No problem buddy
To make all your footer dark just:
it works! 
To make all your footer dark just:
Code: Select all
#footer {
background-color: #000;
color: #fff;
}
#footer a {
color: #fff;
}
hi mate thanks for this but still the same thing white in the middle didn't work. Any other ideas
thanks again for your help
tim
thanks again for your help
tim
Hi sorry i meant the entire footer left right and middle as in the picture shown. I really appreciate the time you are taking to help.
Here is the stylesheet code
and here is the footer.tpl. I did place it in a div id - footer tag before but it only created a black line rather than the whole box.
Thanks again for all of your help.
Here is the stylesheet code
Code: Select all
html {
overflow: -moz-scrollbars-vertical;
margin: 0;
padding: 0;
}
* {
font-family: Arial, Helvetica, sans-serif;
}
body {
margin: 0px;
padding: 0px;
text-align: center;
color:#FFFFFF
}
body, td, th, input, textarea, select, a {
font-size: 12px;
}
form {
padding: 0;
margin: 0;
display: inline;
}
input, textarea, select {
margin: 3px 0px;
}
a, a:visited {
color: #fe00d0;
text-decoration: underline;
cursor: pointer;
}
a:hover {
text-decoration: none;
}
a img {
border: none;
}
p {
margin-top: 0px;
}
/* layout */
#container {
width: 960px;
margin-left: auto;
margin-right: auto;
text-align: left;
background: #000000;
}
#header {
position: relative;
}
#header .div1 {
height: 145px;
}
#header .div2 {
position: relative;
top: 21px;
left: 15px;
}
#header .div3 {
background: url('../image/search.png') no-repeat;
width: 250px;
height: 62px;
position: absolute;
top: 15px;
right: 0px;
padding-top: 5px;
padding-left: 17px;
}
#header .div4 {
padding-left: 10px;
padding-right: 10px;
height: 40px;
background: url('../image/header.png') repeat-x;
}
#header .div4 img {
float: left;
margin-right: 5px;
}
#header .div4 a {
padding: 12px 0px 12px 0px;
margin-left: 10px;
margin-right: 10px;
display: inline-block;
color: #FFFFFF;
text-align: center;
text-decoration: none;
font-size: 14px;
font-family: Verdana, Geneva, sans-serif;
}
#header .div5 a {
float: left;
}
#header .div6 a {
float: right;
}
#breadcrumb {
padding-top: 8px;
padding-bottom: 10px;
padding-left: 10px;
}
#column_left {
float: left;
width: 180px;
margin-right: 10px;
}
#column_right {
float: right;
width: 180px;
margin-left: 10px;
}
#content {
float: left;
width: 580px;
margin-bottom: 10px;
}
#content .top {
padding: 8px 0px 6px 10px;
background: url('../image/content_top.png') no-repeat;
}
#content .top h1, .heading {
color: #ffffff;
font-size: 14px;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-transform: uppercase;
margin: 0px;
}
.heading {
border-bottom: 1px solid #fa01ce;
padding-bottom: 3px;
margin-bottom: 10px;
}
#content .middle {
border-left: 1px solid #fa01ce;
border-right: 1px solid #fa01ce;
background: #000000;
padding: 10px 10px 1px 10px;
min-height: 380px;
}
#content .bottom {
background: url('../image/content_bottom.png') no-repeat;
height: 5px;
}
.box {
margin-bottom: 10px;
background: url('../image/box_top.png') no-repeat;
}
.box .top {
padding: 8px 0px 6px 7px;
color: #FFFFFF;
font-size: 14px;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
text-transform: uppercase;
}
.box .top img {
float: left;
margin-right: 5px;
}
.box .middle {
border-left: 1px solid #000000;
border-right: 1px solid #000000;
background: #000000;
padding: 10px;
}
.box .bottom {
height: 5px;
background: url('../image/box_bottom.png') no-repeat;
}
.success {
padding: 5px 0px;
margin-bottom: 10px;
background: #000000;
border: 1px solid #FFFFFF;
font-size: 11px;
font-family: Verdana, Geneva, sans-serif;
text-align: center;
}
.warning {
padding: 5px 0px;
margin-bottom: 10px;
background: #000000;
border: 1px solid #FFFFFF;
font-size: 11px;
font-family: Verdana, Geneva, sans-serif;
text-align: center;
}
.wait {
padding: 5px 0px;
margin-bottom: 10px;
background: #000000;
border: 1px solid #FFFFFF;
font-size: 11px;
font-family: Verdana, Geneva, sans-serif;
text-align: center;
}
.required {
color: #000000;
font-weight: bold;
}
.error {
color: #FFFFFF;
display: block;
}
.help {
cursor: pointer;
}
.tooltip {
border: 1px solid #FFFFFF;
background: #000000;
padding: 5px;
font-size: 11px;
width: 250px;
}
.clear { /* generic container (i.e. div) for floating buttons */
overflow: hidden;
width: 100%;
}
a.button {
background: transparent url('../image/button_right.png') no-repeat scroll top right;
color: #FFFFFF;
display: inline-block;
font: normal 12px arial, sans-serif;
height: 25px;
margin-right: 6px;
padding-right: 18px; /* sliding doors padding */
text-decoration: none;
}
a.button span {
background: transparent url('../image/button_left.png') no-repeat;
display: inline-block;
padding: 5px 0 5px 18px;
}
.buttons {
background: #fe00d0;
border: 1px solid #FFFFFF;
margin-bottom: 10px;
clear: both;
padding: 5px;
}
.buttons input {
padding: 0px;
margin: 0px;
}
.buttons table {
width: 100%;
border-collapse: collapse;
}
.buttons table td {
vertical-align: middle;
}
.list {
width: 100%;
margin-bottom: 10px;
}
.list td {
text-align: center;
vertical-align: top;
padding-bottom: 10px;
}
.sort {
margin-bottom: 10px;
background: #fe00d0;
height: 30px;
width: 100%;
}
.sort .div1 {
float: right;
margin-left: 5px;
padding-top: 6px;
padding-right: 9px;
}
.sort .div2 {
text-align: right;
padding-top: 9px;
}
.sort select {
font-size: 11px;
margin: 0;
padding: 0;
}
.pagination {
display: inline-block;
width: 100%;
background: #fe00d0;
margin-bottom: 10px;
}
.pagination .links, .pagination .results {
padding: 7px;
}
.pagination .links {
float: left;
}
.pagination .links a {
border: 1px solid #CCCCCC;
padding: 4px 7px;
text-decoration: none;
color: #FFFFFF;
}
.pagination .links b {
border: 1px solid #CCCCCC;
padding: 4px 7px;
text-decoration: none;
color: #FFFFFF;
background: ##fe00d0;
}
.pagination .results {
float: right;
}
.tabs {
display: block;
width: 100%;
margin-bottom: 0px;
}
.tabs a {
float: left;
display: block;
padding: 6px 15px 7px 15px;
margin-right: 2px;
border-top: 1px solid #FFFFFF;
border-bottom: 1px solid #FFFFFF;
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
background: #fe00d0 url('../image/tab.png') repeat-x;
color: #ffffff;
font-weight: bold;
font-size: 13px;
text-decoration: none;
z-index: 1;
position: relative;
top: 1px;
}
.tabs a.selected {
background: #fe00d0 url('../image/tab.png') repeat-x;
border-bottom: 0px;
padding-bottom: 8px;
z-index: 3;
}
.page {
border: 1px solid #ffffff;
background: #000000;
display: inline-block;
padding: 10px;
display: block;
width: 536px;
clear: both;
z-index: 2;
margin-bottom: 10px;
}
#footer {
background-color: #000;
color: #fff;
width: 100%;
clear: both;
padding-top: 5px;
border-top: 1px solid #fe00d0;
}
#footer .div1, #footer .div2 {
background-color: #000;
color: #fff;
}
#footer .div1 {
float: left;
text-align: left;
}
#footer .div2 {
float: right;
text-align: right;
}
#category ul {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 8px;
padding-left: 12px;
list-style: url('../image/bullet_1.png');
}
#information ul {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 8px;
padding-left: 12px;
list-style: url('../image/bullet_2.png');
}
.cart {
border-collapse: collapse;
margin-bottom: 10px;
width: 100%;
border: 1px solid #ffffff;
}
.cart th {
background: #fe00d0;
padding: 5px;
font-weight: normal;
}
.cart td {
padding: 5px;
}
Code: Select all
<div class="div1"><a onclick="window.open('https://www.paypal.com/uk/mrb/pal=W9TBB5DTD6QJW');"><img src="catalog/view/theme/default/image/payment.png" alt="" /></a></div>
<!-- If you want to remove the "Powered by OpenCart" then please donate via PayPal the sum of £100 to donate@opencart.com -->
<div class="div2"><?php echo $text_powered_by; ?></div>
<!-- If you want to remove the "Powered by OpenCart" then please donate via PayPal the sum of £100 to donate@opencart.com -->Thanks again for all of your help.
Ok.. I have analyzed it.. and nothing wrong with your stylesheet.
The problem is on your markup, edit your footer.tpl
Hope it will help..
Anytime buddy.. glad that know that it work
The problem is on your markup, edit your footer.tpl
Code: Select all
<div id="footer">
<div class="div1"><a onclick="window.open('https://www.paypal.com/uk/mrb/pal=W9TBB5DTD6QJW');"><img src="catalog/view/theme/default/image/payment.png" alt="" /></a></div>
<!-- If you want to remove the "Powered by OpenCart" then please donate via PayPal the sum of £100 to donate@opencart.com -->
<div class="div2"><?php echo $text_powered_by; ?></div>
<!-- If you want to remove the "Powered by OpenCart" then please donate via PayPal the sum of £100 to donate@opencart.com -->
<div class="clear"> </div>
</div>
Anytime buddy.. glad that know that it work
Hi thanks again and its worked what a relief lol.
I really appreciate your help mate. The footer id div added an extra line but after taking that div out but leaving the div clear in it worked perfectly.
Cheers mate
tim
I really appreciate your help mate. The footer id div added an extra line but after taking that div out but leaving the div clear in it worked perfectly.
Cheers mate
tim
Who is online
Users browsing this forum: No registered users and 7 guests
