This is an old revision of the document!


Dynamically setting the shipping box dimensions for live rates

If your store ships from multiple different fulfilment centres, you'll probably want the shipping rates to be calculated correctly based on the correct origin point for the customer. This script allows you to change the shipping origin point dynamically from the one set in the store to your own custom location.

Note: Foxy currently only allows for a single box configuration per order. This snippet will not allow you to calculate shipping for multiple different boxes. For faking multiple boxes for a shipment, you can review this snippet.

Add the custom javascript

In your store's administration - navigate to the Configuration page, and within the Cart section look for “Add custom header and footer code to your templates”. Enable that option if it isn't already, and place the following code into the “Footer” textbox:

<script>
function getCustomDimensions(params) {
    // Do your custom logic in here
    if (someCondition) {
        return {"length": 18, "width": 16, "height": 10};
    } else {
        return null;
    }
}
FC.client.on("cart-shipping-options-update", function(params) {
    params.dimensions = getCustomDimensions(params);
});
FC.client.on("checkout-shipping-options-update", function(params) {
    params.dimensions = getCustomDimensions(params);
});
</script>

You'll obviously need to edit the getCustomDimensions() function to correctly set the dimensions based on your conditions such as certain products or categories in the cart.

The getCustomDimensions() function is passed a params variable, which contains two arrays:

  • address: Contains the shipping address that the customer as entered so far
  • fields: Contains the shipping_city, shipping_postal_code, shipping_region and shipping_region_name as entered by the customer to trigger this rate request

The getCustomDimensions() function needs to return an object with three parameters like this: {"length": 18, "width": 16, "height": 10}, the value for each dimension being a number.

If you want to leave the dimensions as the store default, return null from the getCustomDimensions() function.

Make sure you test your shipping results before and after applying this snippet, ensuring you're getting the results that you expect. Different carriers have different allowances for box sizes for their various rates - you can review your chosen carrier(s) website to check on what those maximums are.

Examples

Example 1: Returning the largest dimensions from product level attributes

Foxy products currently feature product level reserved attributes for length, width and height. These values aren't currently utilised anywhere, but can be used in this snippet to determine the shipping dimensions. As an example, the following code would use the largest dimensions for the products in the cart as the dimensions for shipping. The product level attributes would be passed as part of an add to cart, for example https://yourstore.foxycart.com/cart?name=My+Product&code=abc123&price=15.95&length=3&width=3.5&height=2

<script>
function getCustomDimensions(params) {
    var volume = 0,
        dimensions = null;
 
    for (var i = 0; i < FC.json.items.length; i++) {
        var width = parseFloat(FC.json.items[i].width),
            height = parseFloat(FC.json.items[i].height),
            length = parseFloat(FC.json.items[i].length);
 
        var v = width * height * length;
 
        if (v > volume) {
            volume = v;
            dimensions = {"length": length, "width": width, "height": height};
        }
    }
 
    return dimensions;
}
FC.client.on("cart-shipping-options-update", function(params) {
    params.dimensions = getCustomDimensions(params);
});
FC.client.on("checkout-shipping-options-update", function(params) {
    params.dimensions = getCustomDimensions(params);
});
</script>

Site Tools