Access Keys:
Skip to content (Access Key - 0)
Expand all   Collapse all

Contents

About This Guide

Use of FoxyCart with SiteGrinder's "$" ecommerce hint for buttons and forms requires the optional "Commerce" add-on as well as a FoxyCart paid subscription once your store goes live.

This guide discusses only ecommerce features that are unique to the FoxyCart ecommerce module.

For a high level overview of SiteGirnder's ecommerce features see the Ecommerce Essentials Guide.  For details about creating ecommerce buttons, forms, and galleries see the Commerce Add-On reference.

The complete FoxyCart documentation is found on their wiki.

Setting Up Your FoxyCart Account

The email from Media Lab that contains your SiteGrinder+Commerce activation code will provide the url you will use to set up your FoxyCart account.

Once you are at the FoxyCart site, you'll set up your FoxyCart account and create your first store.

Setting up your FoxyCart store is a quick and easy process. 

If you haven't set up an account yet, you should do so now by following the set-up instructions here:

http://wiki.foxycart.com/getting_started:foxycart_setup

If you do not have a payment gateway (the service that actually transfers money from your customers to you) you'll need to sign up for one.

FoxyCart is compatible with all of the most popular gateways and provides a list of them with links on their wiki. (See Section 2 - Reference, in the right-hand column)

As of March 2010 FoxyCart supports the following gateways.  (Click the links for details):

Once you log in to FoxyCart you can configure many settings.

To hook up the payment gateway you'll need to click the "payment" menu at the top of the FoxyCart page.

Setting up your SiteGrinder Site to Link to Your FoxyCart Store

In order to get your SiteGrinder 3 site to correctly link to your FoxyCart store, its important to correctly set two fields in the New Site setup dialog (shown below):


In the FoxyCart Store Name you should enter whatever you named your FoxyCart store when you initially created it in FoxyCart.

In the Domain field, you'll enter the URL provided by FoxyCart to your store. Typically, the first part of this URL will be your store name, in lowercase, with spaces removed. For example, if you named your store "The Apple Stand", then the Domain for your store will most likely be: "theapplestand.foxycart.com".

FoxyCart Operations

FoxyCart support 5 different operations:

  • add to cart
  • add to cart and checkout
  • checkout
  • view cart
  • empty cart

The first three operations have two required pieces of information: the product name and its price. You can use eccommerce forms and the Content Manager's Operation Editor to add more options if you need them.

The remaining three need no additional information.

Customizing the Appearance of FoxyCart

The appearance of the FoxyCart is customizable, but it must be done through editing CSS. 

Documentation and screen movies on customizing  the look of your cart are available at the FoxyCart Site.

Ecommerce Forms with FoxyCart

Generally you will use ecommerce forms with FoxyCart exactly as described in the Commerce Reference Guide.

FoxyCart does provide some extra features you can take advantage of if you so choose:

  • Some form field names will be recognized by FoxyCart and given special significance
  • SiteGrinder allows you to pre-fill some of the fields on the check-out page if you gather that information in your SiteGrinder ecommerce form.

These are described in detail below.

Custom Fieldnames for Custom Options

Many of FoxyCart's advanced features rely on your providing fields with specific "variable names" from your form.  Normally a form's field name is its variable name.  A field named "email:______" uses "email" as the variable name.

But sometimes the variable names you need to use don't make very good field names that the user will see. 

For example, FoxyCart can use a variable named "customer_first_name" to auto fill the appropriate field on the FoxyCart check-out page.  You could make a form field like "customer_first_name:________________", but that's an ugly name to display to the site visitor.

Luckily SiteGrinder forms allow you to specify a variable name that's different from the displayed name. 

In the previous example,we want to make the form field show "First name" to the user but send the value to FoxyCart with the variable name "customer_first_name".

This is

what we would type into that line of the form layer in Photoshop to achieve this:

"First name/customer_first_name:____________________"

Only the part of the label typed before the slash, "First name", will be displayed in the form on the page.

For more information see the "Separating Names and Value" section of the Forms Reference.

Preset Values

The section above discusses setting ecommerce identifiers up to interact with user input. But there are often times you will want custom identifiers to have a fixed value.  For example, maybe the object has a unique product number or weight.  You may be using one of the standard identifiers that FoxyCart makes available, or a custom one that you want to receive with the order for internal tracking.  Preset values can be initialized in the Ecommerce Operation dialog.

Simply

  1. click New Option in the dialog
  2. Fill out the name of the option (such as weight )
  3. set the value for the option.

1.


2.

3.

Standard Field Names Recognized By FoxyCart

Some ecommerce options, like color or size, are just information that you are gathering to go along with the order.  This kind of information will help you fill the order but won't affect the order process.

Other information, such as quantity, are recognized by FoxyCart and directly affect the transaction or the operation of the shopping cart.

Here are the names that FoxyCart recognizes.

  • name: The name of the product that will be displayed in the cart.
  • price: The cost of the product. DO NOT enter a currency sign.
  • code: Item code, can be used however you’d like.
  • quantity: Quantity of products. If left blank, it will default to 1.
    • quantity_max: Maximum quantity that should be allowed per cart, per product, per cart.
    • quantity_min: Minimum quantity that should be allowed per cart, per product, per cart.
    • NOTE: Max and min quantities do not control inventory. The values are per cart/transaction/session.
  • category: Category identifier for the product. This will default to the default category if left blank.
  • weight: Weight, used for shipping. If left blank, it will inherit this value from the product’s category. If no category selected, will default to the default category's weight.
  • shipto: Allows you to specify specific shipto address labels for each cart add (requires multiship feature v0.3.0+).
  • coupon=coupon_code. Add a coupon code directly to the cart. (v0.4.0+) See the discount syntax below and in the admin help for more information on how to configure coupons for your store.

You can name your fields after these or use the technique described in the previous section to pass them as variables separate from the field names.

For more information see the FoxyCart documentation at:

http://wiki.foxycart.com/getting_started:adding_links_and_forms

Pre-Filling FoxyCart Fields From A SiteGrinder Form

FoxyCart allows you to collect information in your form that can be passed along and pre-filled when your customer arrives on the FoxyCart check-out page.

The following names are supported:

  • customer_first_name
  • customer_last_name
  • customer_email
  • customer_address1
  • customer_address2
  • customer_city
  • customer_state
  • customer_postal_code
  • customer_country
  • customer_phone
  • shipping_first_name
  • shipping_last_name
  • shipping_address1
  • shipping_address2
  • shipping_city
  • shipping_state
  • shipping_postal_code
  • shipping_country
  • shipping_phone

For more information see the FoxyCart documentation at:

http://wiki.foxycart.com/docs:checkout:prepopulating

Options That Change The Price

Some options need to change the price.  A photographer might offer multiple print sizes, with each size at a different price.

With a combination of ecommerce forms and a SiteGrinder feature that lets you add custom info to form menus, it's easy to accomplish this with FoxyCart.

Here is an example:

Size: small /small{p:5} |  medium /medium{p:10} | large /large{p:20}
(add to cart)

This will make a two line form, with a size control that displays small, medium and large.  In this case the small is $5, the medium is $10 and the large is $20.

Here is another example:

Size: small/small{p-2} | medium | large/large{p+4}
(add to cart)

In this second example, by selecting the small item the price will be discounted by $2, choosing the large size will add $4 to the price.
Adaptavist Theme Builder Powered by Atlassian Confluence