Customize your BigCommerce template to use same address for both shipping and billing

We are glad that the BigCommerce templates are highly customizable. Using custom HTML and javascript code we can alter the behavior in ways limited only by our imagination.

Maybe you want the customers to select the same address for shipping and billing both. This can be done using some custom JavaScript. Please copy-paste the code below to the checkout_exress.html template file before the %%Panel.Footer%% line.

<script>
function removeShippingDetailsStep() {
    var shippingToThisAddress = $("#ship_to_billing_new");
    if(shippingToThisAddress.attr('checked') !== 'checked'){
        shippingToThisAddress.closest('label').trigger('click');
    }
    shippingToThisAddress.closest('dd').hide();
    $('.billingButton').val('Bill & Ship to this Address');
    $("#CheckoutStepShippingAddress").remove();
    var $shippingProviderStep = $("#CheckoutStepShippingProvider h3");
    var replaceStepNr4 = $shippingProviderStep.html();
    $shippingProviderStep.html(replaceStepNr4.replace('4','3'));
    var $confirmationStep = $("#CheckoutStepConfirmation h3");
    var replaceStepNr5 = $confirmationStep.html();
    $confirmationStep.html(replaceStepNr5.replace('5','4'));
}
$(document).ready(function(){
removeShippingDetailsStep();
});
$(document).ajaxComplete(function(){
removeShippingDetailsStep();
});
</script>

NOTE:

• The code will only hide the options that allow the customer to choose another address for shipping. This only works in single page / express checkout.

Our team is happy to experiment and then publish here the customization we do to the templates. You will find lots of goodies in our BigCommerce templates category full of articles with tutorials and code examples.