Modify the Look of Order Details

This section will explain how to change the look or design of the following sections:

-    Cart table

-    Records below the titles in the cart table (e.g. first name, last name, etc.)

To change the look/design of the cart table, please follow the steps below:

1.   Open the shopcartformatdesign.asp file using Notepad.

2.   The code explained below is used to format the following:

To format the titles in the table, please locate the code below:

sub DisplayTitle (percent, titlename)

            if titlename = getlang("langproduct01") then

                        HtmlWrite "<th class=""menuhdr"">" & TitleName & "</th>"

            else

                        HtmlWrite "<th style=""text-align: center"">" & TitleName & "</th>"

            end if

end sub

Note: CSS  “menuhdr” is stored in the “main-responsive.css” file, which is located in the “templates/default” folder:

.product_sold_table tr:first-child th.menuhdr {

    border-bottom: 1px solid #ddd;

    border-top: 1px solid #ddd;

    padding-bottom: 5px;

    padding-top: 5px;

}

You can update the CSS code above to suit your own style or preference.

For example, if you wish to change the background color of the table title to green, then please update the CSS to:

            .product_sold_table tr:first-child th.menuhdr {

                border-bottom: 1px solid #ddd;

    border-top: 1px solid #ddd;

    padding-bottom: 5px;

    padding-top: 5px;

                background-color:#009900;

  }

Preview of the example above:

To format the records below the titles in the table, please locate the subroutines below the “shopcartformatdesign.asp” file:

sub AddField

sub AddQuantity

sub AddRemoveBox

You can edit any HTML code inside the subroutines mentioned above.