Table of Contents
Tiered Flat Rate Shipping
Versions 0.7.1 and older: Note that applying javascript shipping modifications using either live or flat rates where you are setting custom values has been found to not work as expected for subscription based products where you need the shipping to apply to each subscription renewal. A fix is in place for versions 0.7.2 and newer.
Using version 2.0? There is a new snippet available for our latest version, available from here.
If you're using handling fees note that you can't overwrite handling fees using javascript on the checkout to provide free shipping. While it will appear that the shipping is $0 on the checkout, the handling fees will be added back in server-side, and the customer will see a shipping fee that matches the handling fee cost you have set in the administration.
Tiered Flat Rate Shipping, provides flat rates that are calculated based off of any values you want, like cart cost, total weight, products in the cart etc. Note that this applies the shipping automatically - if you want to provide selectable options, check out http://wiki.foxycart.com/snippets/shipping/multiple_flat_rates
Step 1: Update categories
Update all categories to 'Shipped using a flat rate fee' with a value of 0 in the 'Product Delivery Option' section.
Step 2: Add the javascript
Paste this code right before the closing </head>
tag of your checkout template:
<script type="text/javascript" charset="utf-8"> FC.checkout.config.customShipping = { onLoad: true, // Set to false if you don't want shipping calculated when the checkout loads onLocationChange: false // Set to true if your shipping logic relies on updating whenever the shipping location for the order changes }; function calculateShipping() { var shippingCost = 0; /* BEGIN CUSTOM SHIPPING LOGIC */ /* END CUSTOM SHIPPING LOGIC */ FC.checkout.config.orderFlatRateShipping = shippingCost; FC.checkout.updateShipping(-1); } jQuery(document).ready(function() { if (FC.checkout.config.customShipping.onLoad) { runShippingLogic(); } if (FC.checkout.config.customShipping.onLocationChange) { FC.checkout.overload("updateTaxes", function() { runShippingLogic(); }, null); } }); function runShippingLogic() { // Check to see if there are actually shippable products in the current cart before running the custom shipping (0.7.1+ only), or just run it for older carts if ((typeof(FC.checkout.config.hasShippableProducts) === "boolean" && FC.checkout.config.hasShippableProducts) || typeof(FC.checkout.config.hasShippableProducts) === "undefined") { calculateShipping(); } } </script>
Step 3: Customise
Now the fun part - create your tiers to calculate your shipping and add your custom code between the /* BEGIN CUSTOM SHIPPING LOGIC */ and /* END CUSTOM SHIPPING LOGIC */ lines in the first script block. These can be as simple or as advanced as you want - see http://wiki.foxycart.com/static/redirect/jsonp for information on values in the JSON object.
With whatever custom logic you create, make sure you set the shippingCost
variable with the desired shipping cost. This is what gets passed back to the checkout.
Examples
Example 1: Product Count
This is a basic approach, and is easily interchangeable to total price, weight or other values.
var amount = fc_json.product_count; if (amount <= 5) { shippingCost += 5 * amount; // $5 per product } else if (amount <= 10) { shippingCost += 3 * amount; // $3 per product } else if (amount <= 20) { shippingCost += 2 * amount; // $2 per product } else { // Must be 21 or more products shippingCost = 0; // Free shipping because they bought so much }
Example 2: Shipping Country
For this approach, you'll need to set onLocationChange
to true in Step 2.
var country_code = (jQuery("#use_different_addresses").is(":checked") ? $("#shipping_country").val() : $("#customer_country").val()); switch (country_code) { case "US": shippingCost = 10; break; case "CA": shippingCost = 12; break; default: shippingCost = 20; }