Perlshop 4 - Using the Provided Style Classes

Overview

Perlshop uses a wide variety of Style Sheet class definitions in the pages that it generates for display. These rules can be added to the Perlshop global style sheet file, which is referenced by the $global_style setting in the ps.cfg file.

These class definitions can be used to control the appearance of the following:

The Final Invoice page
The Order Form page
The Search Results page
The Shipping Rates page
The Shopping Cart page
The form buttons added to catalog pages by Perlshop

Note that not all browsers support all Cascading Style Sheet commands. Please check the documentation for your browser for details.

Style Classes used with Form Buttons

These style classes became available in Perlshop version 4.2.03.

Please be aware that not all browsers support dynamic style sheet rules for form buttons. As of this writing, only IE 5 or later supports these rules.

buttonNormal

This is the style class applied to all form buttons created by Perlshop. You may also apply this rule to the buttons that you create for your own catalog pages.

buttonOver

This style rule will be applied to a Perlshop generated form button when the mouse passes over it. You may also apply this rule to the buttons that you create for your own catalog pages.

buttonDown

This style rule will be applied to a Perlshop generated form button when the mouse clicks it. You may also apply this rule to the buttons that you create for your own catalog pages.

buttonOut

This style rule will be applied to a Perlshop generated form button when the mouse moves away from it. You may also apply this rule to the buttons that you create for your own catalog pages.

An Example Form Button

<INPUT type="submit" name="ACTION" value="Order"
        class="buttonNormal"
        onMouseOver="this.className = 'buttonOver';"
        onMouseDown="this.className = 'buttonDown';"
        onMouseOut="this.className = 'buttonOut';">

Style Classes used with the Final Invoice Page

These style classes became available in Perlshop version 4.2.08.

invoiceAddress

This style sheet rule is applied to the company address text located at the top of the invoice page.

invoiceTitle

This style sheet rule is applied to the section titles on the invoice page:

SALES INVOICE
SHIPPING POLICY
RETURN POLICY

invoiceData

This style sheet rule is applied to the billing and shipping data sections of the invoice page.

invoiceContents

This style sheet rule is applied to order contents section of the invoice page.

invoiceDiscount

This style sheet rule is applied to any discounts that may be present on the invoice page.

invoiceRebate

This style sheet rule is applied to any rebate items that may be present on the invoice page.

invoiceTotal

This style sheet rule is applied to the final total displayed on the invoice page.

Style Classes used with the Order Form Page

These style classes became available in Perlshop version 4.2.08.

orderformHeader

This style sheet rule is applied to the text of each major section title on the order form page:

Billing Address
Payment Information
etc.

orderformField

This style sheet rule is applied to the text of each input field name on the order form page:

First Name
City
Card Type
etc.

Style Classes used with the Search Results Display

These style classes became available in Perlshop version 4.2.08.

searchResultHeader

This class is applied to the header row of the search results display table.

searchResultData

This class is applied to each result row of the search results display table.

Style Classes used with the Shipping Rates Display

These style classes became available in Perlshop version 4.2.08.

shippingHeaderRow

This class is applied to the header row of the shipping rates table.

shippingItemRow

This class is applied to each data row of the shipping rates table.

Style Classes used with the Shopping Cart Display

These style classes became available in Perlshop version 4.2.08.

cartHeaderRow

This class is applied to the header row of the shopping cart table.

cartItemRow

This class is applied to each item data row of the shopping cart table.

cartSubtotalRow

This class is applied to each subtotal row of the shopping cart table.

cartTaxRow

This class is applied to each tax data row of the shopping cart table.

discountRow

This class is applied to each discount data row of the shopping cart table.

rebateRow

This class is applied to the rebate information row of the shopping cart table.

An Example Style Sheet File

The following is the contents of an example globalstyle.css file:

.buttonNormal           {color:black;  font-weight:bold}
.buttonOver             {color:yellow; font-weight:bold; cursor:hand}
.buttonDown             {color:green;  font-weight:bold; cursor:hand}
.buttonOut              {color:black;  font-weight:bold; cursor:normal}

.cartHeaderRow          {background-color:lightgrey}
.cartItemRow            {color:black}
.cartSubtotalRow        {color:black}
.cartTaxRow             {color:darkblue; font-weight:bold}

.discountRow            {color:darkblue; background-color:lightgrey}

.invoiceAddress         {color:black}
.invoiceContents        {color:black}
.invoiceData            {color:black}
.invoiceDiscount        {color:green}
.invoiceRebate          {color:green}
.invoiceTitle           {color:blue; font-weight:bold}
.invoiceTotal           {color:black}

.orderformHeader        {color:darkblue}
.orderformField         {color:black}

.rebateRow              {color:darkblue; background-color:lightgrey}

.searchHeaderRow        {color:black; background-color:lightgrey}
.searchItemRow          {color:black; background-color:white}

.shippingHeaderRow      {background-color:lightgrey}
.shippingItemRow        {color:black}