Set the shipping details in the InLine Checkout
Last updated: 29-Feb-2024
Rate this article:
Overview
Pre-set the shipping details for the InLine checkout.
Use case
- Add an HTML link or button in your page like the one below.
- Create a JavaScript click handler to execute the Inline Client desired methods.
- Use the
TwoCoInlineCart.products.add({code, quantity, options})
method to prepare your catalog product. - Call any of the following methods to pre-set the shipping details:
TwoCoInlineCart.shipping.setName('Shopper name');
TwoCoInlineCart.shipping.setEmail('shopper.email@example.com');
TwoCoInlineCart.shipping.setPhone('+1 202 555 0115');
TwoCoInlineCart.shipping.setCountry('US');
TwoCoInlineCart.shipping.setCity('Denver');
TwoCoInlineCart.shipping.setState('Colorado');
TwoCoInlineCart.shipping.setZip('80249');
TwoCoInlineCart.shipping.setAddress('Pena Blvd');
TwoCoInlineCart.shipping.setAddress2('');
5. If you want to reset the shipping details, call theTwoCoInlineCart.shipping.reset()
method.
6. Use theTwoCoInlineCart.cart.checkout()
method to show the cart on your page.
Sample request
HTML
<a href="#" class="btn btn-success" id="buy-button">Buy now!</a>
JavaScript
window.document.getElementById('buy-button').addEventListener('click', function() {
TwoCoInlineCart.products.add({
code: "74B8E17CC0"
});
// Style 1 (all data at once)
TwoCoInlineCart.shipping.setData({
name : 'Shopper name',
country : 'US',
email : 'shopper.email@example.com',
city : 'Denver',
state : 'Colorado',
zip : '80249',
phone : '+1 202 555 0115',
address : '',
address2: 'Pena Blvd'
});
// Reset
TwoCoInlineCart.shipping.reset();
// Style 2 (simple)
TwoCoInlineCart.shipping.setName('Shopper name');
TwoCoInlineCart.shipping.setEmail('shopper.email@example.com');
TwoCoInlineCart.shipping.setPhone('+1 202 555 0115');
TwoCoInlineCart.shipping.setCountry('US');
TwoCoInlineCart.shipping.setCity('Denver');
TwoCoInlineCart.shipping.setState('Colorado');
TwoCoInlineCart.shipping.setZip('80249');
TwoCoInlineCart.shipping.setAddress('Pena Blvd');
TwoCoInlineCart.shipping.setAddress2('');
// Reset
TwoCoInlineCart.shipping.reset();
// Style 3 (chained)
TwoCoInlineCart.shipping
.setName('Shopper name')
.setEmail('shopper.email@example.com')
.setPhone('+1 202 555 0115')
.setCountry('US')
.setCity('Denver')
.setState('Colorado')
.setZip('80249')
.setAddress('Peña Blvd')
.setAddress2('');
TwoCoInlineCart.cart.checkout();
});
Demo
After setting the shipping details for the InLine checkout using the above methods, your cart should look like this:
Rate this article: