Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Changing Drop Menu Look? Is It Possible?


laurentb

Recommended Posts

Hi

I was wondering if it was possible to make changes to the drop menu(s) (currency and manufacturer and others in products)

 

I have 2 questions

 

1/ More or less what I am trying to do is a drop menu that fit my color scheme. So I will like to change the color of the button, background and text as well as text size.

 

2/ I have integrated the currency drop menu in the top bar next to >>My Account|Cart Content|Checkout|Currency.

 

Unfortunately the drop menu is a bit taller than the height of the bar (based on font size until now), and was wondering if it was possible to reduce it? (it could be link to font size in drop menu, not sure).

 

I looked at Form that I believe accept Class=, but cannot find where to integrate it?

 

Thanks

Link to comment
Share on other sites

Ok After quite a while playing around I struck luck

 

on the stylesheet

CHECKBOX, INPUT, RADIO, SELECT

Allows to control the font size from the drop menu.

 

Now I am missing just the way to change the color of that drop menun button

Link to comment
Share on other sites

Hi, I believe all colours can be changed on stylesheet.css. However, includes/functions html_output.php *might* contain a field where you can change the colour.

 

With Stylesheet its a case of going through making changes and noting them until you find it - I have never seen someone break down the stylesheet in the 'for dummies' style (like this does that etc) - which is a shame as I think it would help loads of people!

 

Good luck

 

P.S: Take a backup first!

----------------------------------------

Minxy :)

 

"Keep plodding on to achieve your dreams"

Link to comment
Share on other sites

I got this info from the old osCDox Wiki site

http://oscdox.com/index.php

 

 

 

Elements

 

A :: This element controls the style of all hyperlinks in osCommerce, color, style, borders, image, etc.

A:hover :: This element controls the hover style of all hyperlinks in osCommerce, color, style, borders, image, etc.

BODY :: This element controls the styles of the body of osCommerce. Here you can change the background color and image, margins, width of the catalog, main font color (default text, product text, checkout text, prices, etc.)

CHECKBOX,INPUT,RADIO,SELECT :: This element controls the styles for all Checkbox, Input, Radio and Select controls in osCommerce. The background, color, size, font are all controlled here.

FORM :: This element controls the main form area styles in osCommerce. You can specify background colors, images, whether they display inline, or in the entire form block, font size of the form area. This also controls the font displayed in the search box, but not the fonts displayed in other forms.

TEXTAREA :: This controls the style of the product text display area, but not the actual text of this area. The text is controlled by the BODY element. this also controls the background of the larger text input fields, such as the text input field in the 'contact us' form. Background color, image, border, font of these text areas are all controlled here.

Classes

 

.boxText :: This controls the style of the font in the side boxes. This does not affect any hyperlinks. That is controlled by the A element above. Nor does it affect Box Headings - this is controlled by TD.infoBoxHeading

.checkoutBarCurrent :: This is the style for the current step in the checkout progress bar at the bottom of the checkout pages. This style controls the font family, size and color of the checkout bar current step.

.checkoutBarFrom, .checkoutBarTo :: This is the style for the steps prior to and after the current checkout step in the checkout progress bar at the bottom of the checkout pages. This style controls the font family, size and color of the checkout bar steps that are not currently active.

.errorBox :: This controls the style of the error box that displays when there is an error in the checkout process, such as an incorrect credit card number. The settings controlled by default are the background color, font family, size, and color.

.infoBox :: This specifies the background color of the infoboxes. These are all the side boxes and the new products box on the main page.

.infoBoxContents :: This specifies the styles for all the actual contents of the infoboxes. These are all the side boxes and the new products box. This is where you can change the background color and image of the side boxes. The font setting only seems to have an effect on the 'Shopping Cart' , 'Order History' and 'Bestsellers' box's fonts.

.infoBoxNotice ::

.infoBoxNoticeContents ::

.moduleRow ::

.moduleRowOver :: This controls the mouseover color of rows in modules during the checkout process. For example, when you mouseover a shipping option, the color changes. This controls the mouseover color.

.moduleRowSelected :: This controls the selection color of rows in the modules during the checkout process. For example, when you select a shipping option, the color changes.

.orderEdit :: This controls the style of the '(Edit)' text on the checkout confirmation page.

.productsNotifications :: This controls the table style for product notifications on the checkout success page.

.stockWarning :: This controls the properties of the stock warning text that is displayed in the shopping cart when there is not enough product in stock.

A.headerNavigation :: This controls the color of the links in the header navigation bar. This includes the breadcrumb links and all the site navigation links.

A.headerNavigation:hover :: This controls the hover color of the links in the header navigation bar. This includes the breadcrumb links and all the site navigation links.

A.pageResults ::

A.pageResults:hover ::

SPAN.errorText ::

SPAN.greetUser :: This controls the style of the username in the greeting on the main page.

SPAN.markProductOutOfStock :: This controls the style of the "out of stock" marker that shows up in the shopping cart display next to the out of stock product.

SPAN.newItemInCart :: This controls the style of the 'new item text' that is displayed for the any new item that is added to the cart. This highlights the newest item added to the cart.

SPAN.productSpecialPrice :: This controls the style of the 'special price' text.

TABLE.formArea :: This controls the style of the tables in forms, such as the 'My Account" form. This specifies background color, border, images, etc.

TD.accountCategory ::

TD.fieldKey ::

TD.fieldValue ::

TD.footer :: This controls the styles of the footer bar at the bottom of the page.

TD.formAreaTitle :: This controls the styles of form title text in the user account pages.

TD.headerError :: This controls the style of the header error messages (default is red at the top of the cart)

TD.headerInfo :: This controls the style of the header info messages (default is green at the top of the cart)

TD.headerNavigation :: This controls the style of the header navigation text and background. This does not control the hyperlinks in the header navigation bar. To control link styles in this area, use A.headerNavigation and A.headerNavigation:hover

TD.infoBox, SPAN.infoBox ::

TD.infoBoxHeading :: This controls the style of all the headings in the side boxes and new products box. Control color, background image, font, etc.

TD.main, P.main :: Controls the style of the main text areas in osCommerce, the default page, product text, and info pages text.

TD.pageHeading, DIV.pageHeading :: Controls the style of every page heading. Color, font, size, etc.

TD.productListing-data :: Controls the styles of product listing data on the product listing pages.

TD.productListing-heading :: Controls the styles of the product listing heading on the product listing pages.

TD.smallText, SPAN.smallText, P.smallText :: This controls the styles of small text. This is the text found in the copyright notice, category links in the main text area, product name and price in the new products box and several other places.

TD.subBar ::

TD.tableHeading :: Controls the style of the table headings in the shopping cart, Qty, Products, Total and the headings in the personal address book.

TR.accountHistory-even ::

TR.addressBook-even :: Controls the style in the even numbered entries in the address book.

TR.alsoPurchased-even ::

TR.payment-even ::

TR.productListing-even ::

TR.productReviews-even ::

TR.upcomingProducts-even ::

TR.shippingOptions-even ::

TR.accountHistory-odd ::

TR.addressBook-odd :: Controls the style in the odd numbered entries in the address book.

TR.alsoPurchased-odd ::

TR.payment-odd ::

TR.productListing-odd ::

TR.productReviews-odd ::

TR.upcomingProducts-odd ::

TR.shippingOptions-odd ::

TR.footer ::

TR.header :: Controls the background color of the header cell.

TR.headerError ::

TR.headerInfo ::

TR.headerNavigation ::

TR.productListing-heading ::

TR.subBar ::

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...