The methods described on this page require advanced javascript knowledge, and are not officially supported. They are included in our official wiki because certain shipping methods and functionality are not natively supported, and though we are working on radically improving our shipping functionality, in the meantime these methods may be great workarounds. Use with caution, test, and post in our forum if you run into problems.
The following functionality allows you to add and update any number of custom flat rate shipping options based on any criteria (eg: what categories are products in, total cost of the cart, shipping destination country). This script is limited to flat rate shipping only.
Update all categories to 'Shipped using a flat rate fee' with a value of 0 in the 'Product Delivery Option' section.
Add the following right after the ^^checkout^^ placeholder in your checkout template:
^^custom_begin^^ <div id="fc_custom_shipping_methods_container"> </div> ^^custom_end^^
Add the following right before the closing </head> tag in your checkout template:
<script type="text/javascript" charset="utf-8"> //<![CDATA[ $(document).ready(function() { $("input[name=shipping_service]").live('click', function(){ shipping_service_description = jQuery(this).siblings(".fc_shipping_carrier").html(); shipping_service_description += ((shipping_service_description == "") ? '' : ' '); shipping_service_description += jQuery(this).siblings(".fc_shipping_service").html(); $("#shipping_details").val(shipping_service_description); // Launch FoxyCart functionality FC.checkout.updatePrice(-1); }); /* BEGIN CUSTOM SHIPPING LOGIC */ /* END CUSTOM SHIPPING LOGIC */ }); //]]> </script> <script type="text/javascript" charset="utf-8"> //<![CDATA[ /* Multiple Flat Rate Shipping Options Logic */ // example: addShippingOption('local', 4.99, 'PostBox', 'Express Local'); function addShippingOption(code, cost, carrier, service) { if (jQuery("#fc_shipping_methods_inner").length == 0) { addCustomShippingContainer(); } var newShippingOption = '<label for="shipping_service_' + code + '" class="fc_radio"><input type="radio" class="fc_radio fc_required" value="' + code + '|' + cost + '" id="shipping_service_' + code + '" name="shipping_service" /><span class="fc_shipping_carrier">' + carrier + '</span><span class="fc_shipping_service">' + service + '</span><span class="fc_shipping_cost">' + FC.formatter.currency(cost, true) + '</span></label>'; jQuery("#fc_shipping_methods_inner").append(newShippingOption); } // example: updateShippingOptionCost('local', 4); function updateShippingOptionCost(code, cost) { jQuery("input#shipping_service_" + code).val(code + '|' + cost).siblings("span.fc_shipping_cost").html(FC.formatter.currency(cost, true)); FC.checkout.updatePrice(-1); } // example: removeShippingOption('local'); function removeShippingOption(code) { jQuery("label[for=shipping_service_" + code + "]").remove(); if (jQuery("#fc_shipping_methods_inner").html() == "") { removeCustomShippingContainer(); } FC.checkout.updatePrice(-1); } function addCustomShippingContainer() { jQuery("#fc_custom_shipping_methods_container").html('<h2>Shipping Options</h2><div class="fc_row fc_shipping_methods_container" id="fc_shipping_methods_container"><div class="fc_radio_group_container fc_row fc_shipping_methods" id="fc_shipping_methods"><input type="hidden" value="0" id="shipping_service_id" name="shipping_service_id"><input type="text" style="display:none;" value="" id="shipping_service_description" name="shipping_service_description"><input type="text" value="" id="shipping_details" name="Shipping_Details" style="display:none;" /><div class="fc_shipping_methods_inner" id="fc_shipping_methods_inner"></div><label style="display: none;" class="fc_error" for="fc_shipping_methods">Please select a shipping method.</label></div></div>'); } function removeCustomShippingContainer() { jQuery("#fc_custom_shipping_methods_container").html(""); FC.checkout.updatePrice(-1); } //]]> </script>
Now the fun part, based on whatever criteria you want, add in the different shipping options you require for your site. Add your custom code between the /* BEGIN CUSTOM SHIPPING LOGIC */ and /* END CUSTOM SHIPPING LOGIC */ lines in the first script block. There are four functions available to you.
addShippingOption()code, cost, carrier, serviceaddShippingOption('local', 4.99, 'PostBox', 'Local Delivery');updateShippingOptionCost()code, costupdateShippingOptionCost('local', 5.50);removeShippingOption()coderemoveShippingOption('local');removeCustomShippingContainer()removeCustomShippingContainer();addShippingOption('standard', 5, 'Postmaster', 'Standard Delivery'); addShippingOption('priority', 9.45, 'Postmaster', 'Priority Delivery'); addShippingOption('express', 10, 'PostPlus', 'Express (Next Day)'); if (fc_json.total_weight > 10) { updateShippingOptionCost('standard', 6); updateShippingOptionCost('priority', 10); updateShippingOptionCost('express', 11.99); } if (fc_json.product_count > 5) { removeShippingOption('express'); }
var postage = 0; var country_code = (jQuery("#use_different_addresses").is(":checked") ? $("#shipping_country").val() : $("#customer_country").val()); if (country_code == "US") { postage = 10 + ((fc_json.product_count - 1) * 0.50); addShippingOption('standard', postage, 'USPS', 'Standard'); postage = 12 + ((fc_json.product_count - 1) * 1.50); addShippingOption('express', postage, 'USPS', 'Express'); } else { postage = 15 + ((fc_json.product_count - 1) * 2); addShippingOption('intl', postage, 'USPS', 'International'); }