Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

How to edit this template


boimbonny

Recommended Posts

I have install oscommerse with free templates "freeoscommerce_009" downloaded in http://addons.oscommerce.com/info/7698,

The question is how to modify the css or the template so the default that seen like this

 

pic1.png

 

will be show like this

 

pic1copy.jpg

 

The 2 shoes will be fixed potition in the left and right. So it will make my web feel nicely ^^

Some body could help newbie like me ?

 

 

nb :

css code

@charset "utf-8";

 

/* CSS Document

 

Copyright © Freeoscommerce.com 2011

 

This file is part of a freeoscommerce.com template. Please visit http://www.freeoscommerce.com for licensing and other information.

*/

 

html {

height: 100%;

width: 100%;

}

 

body#freeoscommerce_009 {

margin: 0px;

background: #4de5e5;

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 12px;

}

 

div#wrapper1 {

z-index: 3;

position: relative;

top: 149px;

left: 50%;

margin-left: -501px;

width: 1003px;

min-height: 600px;

padding-bottom: 40px;

}

 

div#wrapper2 {

z-index: 4;

position: relative;

top: 0px;

left: 38px;

width: 927px;

min-height: 600px;

background: #ffffff;

}

 

div#header_wrapper {

z-index: 5;

position: relative;

top: 9px;

left: 9px;

width: 908px;

min-height: 71px;

margin-bottom: 18px;

}

 

div#header {

z-index: 7;

position: relative;

top: 0px;

padding: 12px 12px 0 12px;

}

 

div#top_menu {

z-index: 8;

position: relative;

padding-top: 12px;

width: 100%;

text-align: center;

color: #ffffff;

font-size: 15px;

}

 

div#header_background1 {

z-index: 5;

position: absolute;

top: 0px;

bottom: 0px;

width: 908px;

background: #00534e;

}

 

div#header_background2 {

z-index: 6;

position: absolute;

top: 0px;

height: 71px;

width: 908px;

background: url(images/freeoscommerce_009/header_footer_background.jpg) top center repeat-x;

}

 

div#wrapper3 {

width: 908px;

overflow: auto;

position: relative;

background: url(images/freeoscommerce_009/content_background.jpg) top center repeat-y;

left: 9px;

margin-bottom: 9px;

}

 

div#content_wrapper {

float: left;

position: relative;

left: 187px;

width: 515px;

min-height: 443px;

margin-left: 9px;

}

 

div#content {

position: relative;

top: 0px;

padding: 12px;

width: 491px;

overflow: hidden;

}

 

div#left_sidebar_wrapper {

float: left;

position: relative;

left: -525px;

width: 187px;

min-height: 443px;

background: url(images/freeoscommerce_009/sidebar_background.jpg) top center repeat-x;

}

 

div#left_sidebar {

position: relative;

top: 0px;

padding: 12px;

width: 163px;

overflow: hidden;

}

 

div#right_sidebar_wrapper {

float: left;

width: 187px;

min-height: 443px;

margin-left: 10px;

background: url(images/freeoscommerce_009/sidebar_background.jpg) top center repeat-x;

}

 

div#right_sidebar {

position: relative;

top: 0px;

padding: 12px;

width: 163px;

overflow: hidden;

}

 

/* Footer */

 

div#footer {

z-index: 5;

position: relative;

left: 9px;

width: 908px;

min-height: 71px;

padding-bottom: 9px;

text-align: center;

color: #ffffff;

}

 

div#footer_background1 {

z-index: 6;

position: absolute;

top: 0px;

bottom: 9px;

left: 0px;

width: 908px;

background: #00534e;

}

 

div#footer_background2 {

z-index: 7;

position: absolute;

top: 0px;

left: 0px;

height: 71px;

width: 908px;

background: url(images/freeoscommerce_009/header_footer_background.jpg) top center repeat-x;

}

 

div#footer_content {

z-index: 8;

position: relative;

padding-left: 20px;

padding-top: 10px;

padding-bottom: 10px;

width: 870px;

min-height: 50px;

}

 

div#footer .grid_24 {

width: 100%;

}

 

/* Footer links */

 

#freeoscommerce_009 div#footer a:link {

color: #4de5e5;

}

 

#freeoscommerce_009 div#footer a:visited {

color: #4de5e5;

}

 

#freeoscommerce_009 div#footer a:hover {

color: #ffffff;

}

 

#freeoscommerce_009 div#footer a:active {

color: #4de5e5;

}

 

div#left_shadow {

z-index: 4;

position: absolute;

left: 0px;

top: 0px;

width: 38px;

height: 429px;

background: url(images/freeoscommerce_009/left_shadow.jpg) top center no-repeat;

}

 

div#right_shadow {

z-index: 4;

position: absolute;

right: 0px;

top: 0px;

width: 38px;

height: 429px;

background: url(images/freeoscommerce_009/right_shadow.jpg) top center no-repeat;

}

 

div#top_background {

z-index: 2;

position: absolute;

top: 0px;

width: 100%;

height: 386px;

background: url(images/freeoscommerce_009/top_background.jpg) top center no-repeat;

}

 

div#main_background {

z-index: 1;

position: absolute;

top: 0px;

width: 100%;

height: 591px;

background: url(images/freeoscommerce_009/main_background.jpg) top center repeat-x;

}

 

/* Website name and/or logo */

 

body#freeoscommerce_009 div#website_name {

z-index: 8;

position: absolute;

top: 0px;

color: #ffffff;

text-align: right;

width: 800px;

top: 105px;

left: 50%;

margin-left: -400px;

font-size: 24px;

letter-spacing: 1.5px;

}

 

body#freeoscommerce_009 div#website_name a {

color: #ffffff;

text-decoration: none;

}

 

/* Website links */

 

body#freeoscommerce_009 a:link {

color: #00534e;

text-decoration: none;

}

 

body#freeoscommerce_009 a:visited {

color: #00534e;

text-decoration: none;

}

 

body#freeoscommerce_009 a:hover {

color: #000000;

text-decoration: none;

}

 

body#freeoscommerce_009 a:active {

color: #00534e;

text-decoration: none;

}

 

/* Top menu links */

 

body#freeoscommerce_009 #top_menu a:link {

color: #ffffff;

text-decoration: none;

}

 

body#freeoscommerce_009 #top_menu a:visited {

color: #ffffff;

text-decoration: none;

}

 

body#freeoscommerce_009 #top_menu a:hover {

color: #4de5e5;

text-decoration: none;

}

 

body#freeoscommerce_009 #top_menu a:active {

color: #ffffff;

text-decoration: none;

}

 

#top_menu span {

margin-left: 12px;

margin-right: 12px;

}

 

/* Headings */

 

body#freeoscommerce_009 h1 {

font-size: 14px;

font-weight: bold;

}

 

body#freeoscommerce_009 h2 {

font-size: 13px;

font-weight: bold;

}

 

body#freeoscommerce_009 h3 {

font-size: 12px;

font-weight: bold;

}

 

body#freeoscommerce_009 h4 {

font-size: 12px;

}

 

body#freeoscommerce_009 h5 {

font-size: 12px;

}

 

body#freeoscommerce_009 h6 {

font-size: 12px;

}

 

hr.accessibility {

height: 1px;

color: #00534e;

}

 

/* Message Stack */

 

body#freeoscommerce_009 .messageStackError, body#freeoscommerce_009 .messageStackWarning {

font-family: Verdana, Arial, sans-serif;

font-size: 10px;

color: #000000;

background-color: #ffb3b5;

}

 

body#freeoscommerce_009 .messageStackSuccess {

font-family: Verdana, Arial, sans-serif;

font-size: 10px;

color: #000000;

background-color: #0089d0;

}

 

/* Product Listing */

 

div.ui-widget-header {

background: none;

border: none;

}

 

#freeoscommerce_009 .productListingHeader {

color: #012b29;

}

 

table.productListingData {

background: #2a2a2a;

color: #012b29;

}

 

body#freeoscommerce_009 table.productListingData tr.alt td {

background: #2d2d2d;

}

 

div.productListTable {

background: none;

border: none;

}

 

/* Columns */

 

#freeoscommerce_009 .ui-widget-header {

color: #012b29;

}

 

#freeoscommerce_009 .infoBoxContents {

background: none;

border: none;

}

 

table.ui-widget-content {

background: none;

border: none;

color: #000000;

}

 

/* Info box */

 

.infoBoxContents {

color: #012b29;

background: none;

border: none;

}

 

/* Checkout */

 

.checkoutBarFrom, .checkoutBarTo {

font-family: Verdana, Arial, sans-serif;

font-size: 10px;

color: #8c8c8c;

}

 

body#freeoscommerce_009 .checkoutBarCurrent {

font-family: Verdana, Arial, sans-serif;

font-size: 10px;

color: #000000;

}

 

body#freeoscommerce_009 div.ui-progressbar-value {

background: #1ba29c;

}

 

body#freeoscommerce_009 .moduleRow { }

 

body#freeoscommerce_009 .moduleRowOver {

background-color: #abeeee;

cursor: pointer;

cursor: hand;

}

 

body#freeoscommerce_009 .moduleRowSelected {

background-color: #8dd0d0;

}

 

a span.orderEdit {

color: #0089d0;

}

 

/* Date picker */

 

#freeoscommerce_009 table.ui-datepicker-calendar a:link {

color: #000000;

}

 

/* Buttons */

 

.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary {

font-weight: bold;

}

 

.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary {

opacity: .7;

filter:Alpha(Opacity=70);

font-weight: normal;

}

 

body#freeoscommerce_009 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {

border: 1px solid #01534f;

background: #80d5d2 url(images/freeoscommerce_009/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x;

font-weight: bold;

color: #01534f;

}

 

body#freeoscommerce_009 .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {

border: 1px solid #01534f;

background: #5ab5b2 url(images/freeoscommerce_009/ui-bg_glass_75_d0e5f5_1x400.png) 50% 50% repeat-x;

font-weight: bold;

color: #01534f;

}

 

body#freeoscommerce_009 .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {

border: 1px solid #01534f;

background: #5ab5b2 url(images/freeoscommerce_009/ui-bg_inset-hard_100_f5f8f9_1x100.png) 50% 50% repeat-x;

font-weight: bold;

color: #01534f;

}]

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...