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"" colspan="""& percent &""">" & 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:
.menuhdr { text-align: right;
}
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 and text color of the title to black, then please update the CSS to:
.menuhdr { text-align: right;background-color:#009900;color:#000; }
Preview of the example above:
To format the records below the titles in the table, please locate the sub routine below in the “shopformatorder.asp” file:
sub AddField (percent, alignment, fieldvalue)
%>
<td class="item_row" width="<%=percent%>" style="text align:<%=alignment%>"><%=fieldvalue%></td>
<%
end sub
You can edit any HTML code inside the
sub routine mentioned
above.
For example,
you want to display the ordered items background with blue color and text to
white, you can modify above to:
sub AddField (percent, alignment,
fieldvalue)
%>
<td class="item_row" width="<%=percent%>" style="text-align:<%=alignment%>;background-color:#36C;color:#FFF;"><%=fieldvalue%></td>
<%
end sub
Preview of the example above: