Site Setup
Index
Site Basics - click here for help
Header Area - click here for help
Main Page - click here for help
Navigation Bar - click here for help
Item
List Layout - click here for
help
Customizing Your Catalog
Appearance
You may customize the look and feel of your
shopping cart with color, graphics and layout. These features make it possible
to integrate your shopping cart with the rest of your company's website or to
set up your store builder as a stand alone site. There are
five sections to the Site Setup option with buttons at the top of the page and a
clickable, visual
layout of the storefront as it looks in your Web Browser. The sections are Site Basics, Header, Main Page, Navigation, and Item List Layout.
In the Header,
Main Page, and Navigation
sections you may choose a font type and size, and also in the Navigation area you can chose a colored
graphic for the buttons . If the type
size is too large, it will cause scroll bars to be created. You should understand
that your end customers have various size screens with different resolutions
and different browsers, causing deviations from the view of what you have entered. Also,
some older version browsers cannot read some of the newer graphics that you may
want to use. 2 Click Commerce software has been tested with various browser
versions and if the browser cannot support an advanced graphic, a default has
been chosen that will be displayed to those customers. All pictures should be
in .jpg or .gif formats and the file names should have no spaces.
In the header section you are given three
layout choices and the ability to upload your own logo or company banner. In
the main body section, you are given four options for layout with the ability
to upload a graphic. There are also two separate text areas for you to use.
These can be in HTML to allow for text formatting. You may choose the colors
for the header, body and categories background and text as well as the
highlight color for the categories. You can also choose to have a background
image graphic instead of colors in all three sections . If you choose to have a background, it will overlay any colors
chosen for the areas.
There is also a link to the Welcome letter in the text 2 field (described in the Main Page area) that should be deleted while you are setting up your store.
This section contains
required and optional fields for your company's information. It is used in
several places in the system e.g. it is sent to the customer in the order
confirmation email and it is also displayed in the header when you choose
option 1 or 2 in the Header
Area.
Company Name - required
Company Address - required
City - optional
State - optional - drop down box
Country - optional - drop down box
Zip
- optional
Customer Service Phone Number - required
Customer Service Fax Number - optional, appears on Mail
and Print Order form
Response E-Mail - optional, used for your
customers to send email with questions or concerns about their orders. Multiple
email addresses may be entered for different people who will be receiving the
email. A semicolon and space should separate each email address.
Please enter the appropriate information in
the fields. When you have completed these entries, click on the Update Now button and
your entries will be saved. You can look at how your main page will appear by
clicking the View your changes in a new window button. If you wish to make changes,
go back to the fields and enter the new information. You can repeat these steps
as many times as needed until your site has the appearance you wish to achieve.
Header Layout: will determine what information is displayed in the header section of your shopping catalog. There is also a check box where you can have your name and logo appear on all pages of the shopping process. Just click this box to have the header area appear on all screens.
The
Header Layout area also determines how your information is displayed. If needed
please refer to the layout shown above, you will need to choose one of the
following options.
Option 1:
This is the
default option displaying the company information provided by you, in simple
text and in the color scheme you choose without a graphic.
Option 2:
Gives you the
opportunity to upload a company logo to be displayed to the left of your
company information. Again, the company information comes from your entries and
is displayed in the colors that you choose.
Option 3:
Is similar to
option 2 since it allows you to upload a logo picture but in this option it
will be displayed next to data that you enter in the Header Text box. The
information you put in this box can be simple text but it can also accept plain
HTML to give you the ability to add formatting. There are fields for your
picture and text if you use this option. This option can also be used if you do
not want a graphic but just text.
Option 4:
This option
allows you to upload a company banner to be displayed in the header section. No
other information will be displayed with the banner.
Note:
The header section of your store has a height of 150
pixels. For this reason you should keep the height of the pictures you upload
to no more than 145 pixels. It is also suggested not to exceed 600 pixels for
the banner and 225 pixels for your logo. Some of your customers may be viewing
your site through a 640 x 480 pixel monitor resolution.
Click on the option that you wish to use for
your site and proceed to the Header Picture and Text fields.
Banner or Logo Picture: optional, your pictures
should be in gif or jpg format so that your customers can view them using
various browser versions. Also be sure that your picture file name has no
spaces in it. This is important because not all browsers can read a file with a
space in it.
Currently -
this will be
blank if this is your initial setup. If you have previously uploaded a picture,
the picture will appear. Click on the Browse button to retrieve and upload a
picture from your computer. To delete the current picture without replacing it,
put an X
in this field.
Header
Text: this section will be used if you choose option 3 from
above. The information in this box can be HTML in order to allow for text
formatting. Enter text that you want to appear in the header section.
Text Background Settings: in these fields
you will be given the opportunity to choose the background color and text color
of your header or to display a background image. Click on a Set
Color button and the colors will appear in a separate window.
Click on the color you want for the background and then for the text of the
header area. The color that is currently in effect will appear next to the box,
if no color has been chosen, it will be blank.
Text Color: click on the Set Color button to choose the color.
Font:
you can select
any font from the drop down box or enter a font name that is recognized by
HTML.
Font Size:
select a size
from 1-5 and view the selection in the Preview box. The preview will show exactly
how the size and type font will look. Remember that different size screens and
resolutions may cause differences in what an end customer can see.
Background Color: click on the Set Color button to
choose the color.
Background Image
Currently -
this will be
blank if this is your initial setup. If you have previously uploaded a picture,
the picture will appear. Click on the Browse button to retrieve and upload a
picture from your computer. To delete the current picture without replacing it,
put an X
in this field. Use the Browse
button to upload a background image. This will override any colors chosen
above.
When you have completed these entries, click
on the Update Now
button and your entries will be saved. You can look at how your main page will
appear by having another window open to the customer side of the cart and click
the refresh button to view the entries
you have made. If you wish to make changes, go back to the fields and
enter the new information. You can repeat these steps as many times as needed
until your site has the appearance you wish to achieve.
Layout: will determine
what information is displayed in the body section of the main page of your
shopping cart. The following options give you flexibility in customizing the main
page of your shopping cart. The Main Page
Layout does not determine the layout for displaying your products,
this is done in the Item List Layout.
There are two text boxes described in the options listed below. As with all the
text boxes, both of these boxes will accept standard HTML for the purpose of
formatting text. You must choose one of the Body Style options for your
catalog.
Option 1:
Allows you the
ability to display a picture on the left half of the page with the information
in the Text2
box being displayed on the right.
Option 2: Allows for a
smaller picture with the information in the Text1 box being displayed next to it on
the right, and the information in the Text2 box being displayed below.
Option 3: Designed to
having a banner picture displayed in the center of the body section with the
information in the Text2
box displayed directly below it.
Option 4: Allows for the
information in the Text2
box to be displayed in the entire body section.The default is option 1, click on the option
you want to select for your catalog and proceed to Body Picture Text1 or
Text2
fields if needed.
Picture: optional, your pictures should be in gif or
jpg format so that your customers can view them using various browser versions.
Also be sure that your picture file name has no spaces in it. This is important
because not all browsers can read a file with a space in it.
Currently - this will be
blank if this is your initial setup. If you have previously uploaded a picture,
the picture will appear. Click on the Browse button to retrieve and upload a
picture from your computer. To delete the current picture without replacing it,
put an X
in this field.
Text1: enter text to be displayed in the Text1 field.
Text2: enter text to be displayed in the Text2 field. Be sure to delete the link to the Welcome letter that is initially included in this field.
Background/Text Settings:
In these
fields you will be given the opportunity to choose the background and text
colors of the main body of your site. Click on the Set Color button and
the colors will appear in a separate window. Click on the color you want for
the body background and then for the body text. The color in effect now will
appear next to the box, if no color has been chosen, it will be blank.
Background Color - the main background color
of the body of your shopping cart. Click on the Set Color button to choose the color.
Text Color - the color of most of the text displayed
throughout the site. Click on the Set Color button to choose the color.
Font:
you can select
any font from the drop down box or enter a font name that is recognized by
HTML.
Font Size): select a size
from 1-5 and view the selection in the Preview box. The preview will show exactly
how the size and type font will look. Remember that different size screens and
resolutions may cause differences in what an end customer can see.
Background Image:
Currently - this will be
blank if this is your initial setup. If you have previously uploaded a picture,
the picture will appear. Click on the Browse button to retrieve and upload a
picture from your computer. To delete the current picture without replacing it,
put an X
in this field. Use the Browse
button to upload a background image.
When you have completed these entries, click
on the Update Now
button and your entries will be saved. You can look at how your main page will
appear by having another window open to the customer side of the cart and click
the refresh button to view the entries
you have made. If you wish to make changes, go back to the fields and
enter the new information. You can repeat these steps as many times as needed until
your site has the appearance you wish to achieve.
Text
Settings:
Text Color - the color of the text being displayed over
the top of the categories. Click on the Set Color button to choose the color.
Text Highlight Color - the color when the mouse
moves over a category, link or other button. Click on the Set Color button to
choose the color.
Main Category Font:
you can select
any font from the drop down box or enter a font name that is recognized by
HTML.
Main Category Font Size:
select a size
from 1-5 and view the selection in the Preview box. The preview will show exactly
how the size and type font will look. Remember that different size screens and
resolutions may cause differences in what an end customer can see.
Sub Category Font:
you can select
any font from the drop down box or enter a font name that is recognized by
HTML.
Sub Category Font Size:
select a size
from 1-5 and view the selection in the Preview box. The preview will show exactly
how the size and type font will look. Remember that different size screens and
resolutions may cause differences in what an end customer can see.
Button Visual/Textual Settings: this section is not available with the Basic Store Builder
Overall: this area allows you to set an overall graphic for your buttons for the main and sub-categories and Other Buttons. Backgrounds/images for individual categories can be modified from the Product Categories option.
Main Category Button Picture: click on the See Available button
to select a graphic for your buttons, there are a number of styles and colors
to choose from.
Currently - this will be
blank if this is your initial setup. If you have previously uploaded a picture,
that picture will appear. Click on the See Available button to retrieve and upload a
new graphic. To delete the current picture without replacing it, put an X in this field.
Sub Category Button Picture: click on the See Available button
to select a graphic for your buttons, there are a number of styles and colors
to choose from.
Currently - this will be
blank if this is your initial setup. If you have previously uploaded a picture,
the picture will appear. Click on the See Available button to retrieve and upload a
new graphic. To delete the current picture without replacing it, put an X in this field.
Other Buttons Picture: click on the See Available button
to select a graphic for your buttons, there are a number of styles and colors
to choose from. In the Other Buttons option you can upload your
own graphic or change colors of individual buttons.
Currently - this will be blank if this is your initial setup. If you have previously uploaded a picture, the picture will appear. Click on the See Available button to retrieve and upload a new graphic. To delete the current picture without replacing it, put an X in this field.
Individual: you can change the text for the Product Categories heading as well as the button text for Main Page, Featured Products, Product Search, Email, Logon and My Account. The View Cart button can be replaced altogether by using the Set Button Graphic feature (as is done in Product Categories - click here for help). If you just want to change the text of this button without adding a graphic, click the Text Settings option - Navigation Bar tab.
Product Categories Heading Text: (Orig: Product Categories) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the Product Categories text with Our Products.
View Cart Button: to create a new graphic for this button use the Set Button Graphic feature and upload a new image. Click here for help for this function. The default is the button pictured below. You can also just change the text for this button (not load a whole new image) in the Text Settings option - Navigation Bar tab. An example for this button would be to replace View Cart with My Shopping Bag and an appropriate graphic.
-
Default
Main Page Button Text: (Orig: Main Page) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the Main Page button text to say Store Front.
Featured Products Button Text: (Orig: Featured Products) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the Featured Products button text with New Products.
Product Search Button Text: (Orig: Product Search) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the Product Search Button Text with Find Items.
Classifieds Button Text: (Orig: Classifieds) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the Classifieds button text with Bulletin Board.
Email Button Text: (Orig: Email) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the Email button text with Contact Us.
Logon Button Text: (Orig: Logon) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the Logon button text with Sign In.
My Account Button Text: (Orig: My Account) - enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. You can also choose to create a new button graphic, add color or add a pre-designed graphic by clicking the Set Button Graphic/Color button. An example would be to replace the My Account button text with My Information.
Background Color - this is the background
color of the strip that runs down the left portion of the body of the site.
Click on the Set Color
button to choose the color.
Background Image:
Currently -
this will be
blank if this is your initial setup. If you have previously uploaded a
background image,
the picture will appear. Click on the Browse button to retrieve and upload a graphic
from your computer. To delete the current picture without replacing it, put an X in this field.
Subcategories
can be expanded and contracted: Subcategories are hidden by
default and can be expanded by clicking a + next to it. This saves
space and is recommended if you have many subcategories. Click this box to have
your subcategories hidden.
When you have completed these entries, click
on the Update Now
button and your entries will be saved. You can look at how your main page will
appear by having another window open to the customer side of the cart and click
the refresh button to view the entries
you have made. If you wish to make changes, go back to the fields and
enter the new information. You can repeat these steps as many times as needed
until your site has the appearance you wish to achieve.
Item Properties to Display: allows you to select, with a radio button, how your items will sort and be displayed and then you can select which headings/properties will appear for your list of products, e.g. thumbnails, product code, manufacturer and price. Click the Order By Items button and then select with the check boxes which properties will be displayed. You can also change the text of these properties by entering a new title in the box. If you do not want a field to be displayed, simply uncheck the field.
Product Code: enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. An example would be to replace the Product Code text with Part Number.
Manufacturer: enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. An example would be to replace the Manufacturer text with Brand Name.
Product Name: enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. An example would be to replace the Product Name text with Item Name.
Price: enter new text in this field. If you delete the current phrase and do not replace it, a blank space will appear on the screen, there is no default for this field. The original text is in parentheses next to the field name. An example would be to replace the Price text with Cost.
Color Scheme: you can choose the primary
and alternating colors that appear in the background of your list of products.
These colors will also be displayed when the customer accesses My Account
and clicks on My Favorites and My Order History.
Primary
Color: this is the first color of the
list of products. Click on the Set Color button to choose the color.
Alternating
Color: this is second color of the list of products. Click on the Set Color button to
choose the color.
Display: you can choose
the layout of how your products will appear on the page, one, two or three
across the screen. Click the layout you wish to use. You can also select how
many products to display per page. The default is 30.
Thumbnail
Settings: you can increase or decrease the size of your
thumbnail pictures. The default size is 30x30, this is quite small so that if
you select a two or three across layout, you may want to increase the size of
the picture to at least 50x50 or 75x75.
When you have completed these entries, click
on the Update Now
button and your entries will be saved. You can look at how your main page will
appear by having another window open to the customer side of the cart and click
the refresh button to view the entries
you have made. If you wish to make changes, go back to the fields and
enter the new information. You can repeat these steps as many times as needed
until your site has the appearance you wish to achieve.
If this is the initial setup of your store,
you should now proceed to the Billing Setup option.