How to get your website's store set up to work with FoxyCart.

For a nice and quick FoxyCart implementation, insert the code from “Step 1” of the sample code section of your FoxyCart admin into the head section of your webpage, after any other CSS or javascript tags you might have.

jQuery is already loaded when you copy/paste the “Sample Code”, and if you include jQuery again the default Colorbox-style cart will break, and your cart will not load in the modal window at all. To ensure this isn't the case, follow these simple steps:

1. View your site as it is output in the browser. In other words, load the site itself, and not your templates.
2. View the source.
3. Do a “find” on the source for “jquery”. You should see it once inside the <!– BEGIN FOXYCART CODE –> block. You may see it elsewhere also.
   • If you see any files like validation.jquery.js, jquery.accordion.js, or anything similar, those are plugins and can remain.
   • If you see any files like jquery.js, jquery.js?m=1273512554g&ver=1.3.2, jquery-1.4.2.min.js, or anything similar, find out where those <script /> tags are being inserted, and remove them. Reload your page and view the source to ensure they're all gone.
   • If you cannot remove calls to jquery.js, make sure you move your <!– BEGIN FOXYCART CODE –> block after any other jQuery calls.
4. Test.
5. Test again.
6. If you need help, please ask in our forum.

Products are added to your customer's cart using “add to cart links” that you create. Create your FoxyCart links the same as you would create any HTML link (e.g.: <a href=“blah”>Link Text</a>) To make this a FoxyCart link you'll need to create a link with an href pointing to your FoxyCart domain: http://YOURSUBDOMAIN.foxycart.com/cart?name=ITEMNAME&price=YOURPRICE

In this example, YOURSUBDOMAIN is the value you entered as your store subdomain.

ITEMNAME is, of course, the name you would like the cart to display for your item.

<a href="http://YOURSUBDOMAIN.foxycart.com/cart?name=ITEMNAME&price=YOURPRICE">Add to Cart</a>

Though you don't need to, it may save you time to use one of our default styles in your checkout template.

To use one of our default stylesheets as a starting point, simply add the following calls into the head section of your template:

    <!-- BEGIN FOXYCART FILES -->
    <link rel="stylesheet" href="https://YOURSUBDOMAIN.foxycart.com/themes/standard/styles.css" type="text/css" media="screen" charset="utf-8" />
    <!-- END FOXYCART FILES -->

You can then easily create an additional stylesheet of your own to override the styles in default.checkout.css, or you can just copy the contents of default.checkout.css into your own stylesheet, edit as desired, and skip the FoxyCart CSS altogether.

So your code might look like this:

    <!-- BEGIN FOXYCART FILES -->
    <link rel="stylesheet" href="https://YOURDOMAIN.foxycart.com/themes/standard/styles.css" type="text/css" media="screen" charset="utf-8" />
    <!-- END FOXYCART FILES -->
 
    <!-- Override FoxyCart CSS with your own stylesheet: -->
    <link rel="stylesheet" href="https://www.your-domain.com/path/to/your.css" type="text/css" media="screen" charset="utf-8" />