The integration of Swap Global with Shopify's extensibility features significantly improves the checkout process, particularly for Shopify Plus stores. This article will explore how Swap Global interacts with Shopify's checkout, the specifics of the Tax Breakdown Extension, and the benefits it offers merchants and customers.
Swap Global in Non-Plus Stores
For non-Plus Shopify stores, the interaction between Swap Global and the checkout process is straightforward. Swap Global acts solely as the shipping carrier. Swap Global updates the shipping rate to include the tax when customers change their shipping address during checkout. This seamless interaction ensures that customers receive accurate shipping rates without additional complexities.
Swap Global in Plus Stores
The interaction between Swap Global and the checkout process in Shopify Plus stores is more sophisticated. Shopify Plus offers more capabilities, allowing for a more integrated and detailed display of shipping and tax information. The Tax Breakdown Extension plays a big role here.
Tax Breakdown Extension
The Tax Breakdown Extension is a feature designed for Shopify Plus stores. It requires a Shopify Plus plan to function. Its primary purpose is to display a complete line-by-line breakdown of all charges contributing to the total shipping line amount.
When customers choose a shipping option provided by Swap Global at checkout, the extension provides a detailed description that appears beneath each shipping option. This breakdown includes all applicable charges, ensuring transparency and clarity for customers.
Hiding the Breakdown
Any sections of the breakdown with a value of 0 are automatically hidden.
For example: If shipping is $10, taxes are $0 (due to VAT inclusion), and duties and fees are $5, the breakdown will display as follows:
- 10 USD Shipping | 5 USD Duties and Fees.
If shipping is the only section with a non-zero value, the entire breakdown will be hidden.
For example: If shipping is $10, and both taxes and duties & fees are $0, the breakdown will not be shown at all.
Manually Hiding the Breakdown
If you always wish to hide the breakdown regardless of the value, this can be achieved through the Shipping Zone page. Use the toggle in the shipping rule to hide it for each individual shipping rate.
This toggle must be active for each individual shipping rate in order for no breakdowns to display for all available shipping methods in this rule.
UI Placement
Initially, Shopify allowed more flexibility in UI placement on the checkout page. Merchants often expect the tax breakdown to appear on the right side of the checkout screen within the order totals. This placement was common, providing a familiar experience for merchants and customers.
However, Shopify has now restricted where UI elements can be inserted during checkout. The ability to add breakdowns to the right-side order totals was removed, prompting a change in how the tax breakdown is displayed.
In response to Shopify's new restrictions, we opted to display the tax breakdown in the shipping section of the checkout page. This adjustment ensures the necessary information is available to customers in a different location. When a customer selects a shipping option, a dropdown menu shows the detailed line-by-line breakdown.
Limitations and Availability
It is important to note that Shopify Checkout UI Extensions, including the Tax Breakdown Extension, are available only to stores on the Shopify Plus plan. This limitation means that non-Plus stores cannot leverage these advanced features, making it a distinct advantage for Shopify Plus merchants.
Tax Breakdown in Order Notes
The order notes feature adds the shipping costs, taxes, and duties to the order notes in Shopify so both merchants and customers can review them.
The shipping line total charged to the customer at checkout is the sum of various factors, including:
- The shipping rate
- Taxes (VAT or Sales Tax)
- Import duties and fees
Once the order is completed, this breakdown is added to the Shopify Order Page as an order note.
While the merchant can view the full breakdown on the Swap Dashboard, both the merchant and the customer can view it on the related order page on Shopify’s website.