Published on:
Sticky.io, formerly known as LimeLight CMS, is a versatile e-commerce platform that specializes in subscription management and recurring billing solutions. It is designed to help businesses optimize their customer lifecycle for subscription goods and services. Sticky.io facilitates comprehensive management of customer relationships, transactions, and billing cycles. The platform is known for its robust analytics, allowing businesses to track performance metrics and customer interactions effectively. This helps in making data-driven decisions that enhance customer retention and maximize revenue.
Integrating CBSplit and sticky.io can revolutionize the way businesses manage their e-commerce platforms. These tools offer powerful options for enhancing checkout processes, handling product displays, and managing subscriptions efficiently. This article will delve into how these integrations work and provide practical guidance on setting them up to maximize your sales funnel efficiency.
Setting up the checkout and order form with CBSplit and LimeLight involves several steps to ensure that everything functions seamlessly:
Order Form Configuration: Place the following snippet on the order form page: [[ $stickyioOrderFormHandler ]]
. By default, the handler searches for a form with an ID of order-form
. If your form ID differs, use the form
attribute to override the default ID: [[ $stickyioOrderFormHandler form="custom-order-form" ]]
.
Billing Address Setup: Include a checkbox for the billing address that mimics the shipping address by default. Use the following HTML input element: <input type="checkbox" name="billingSameAsShipping" value="yes" checked>
. Also, add a billingAddressContainer
which remains hidden until the user decides to provide a different billing address.
Country and State Selection: There is no need to manually list countries or states. Simply include <select name="shippingCountry">
and <select name="billingCountry">
, and the states and countries will be populated automatically.
Error Handling: By default, window.alert
is used to show error messages. For a custom error handler, define a global function and pass it to the handler via the errorHandler
key, e.g., [[ $stickyioOrderFormHandler errorHandler="customErrorHandlerFunction" ]]
.
When a credit card transaction is declined during upsell processing, setting up a retry form is crucial:
Retry Form Setup: Place the snippet [[ $stickyioRetryFormHandler ]]
on the retry page. Similar to the order form setup, use form
attribute to specify a different ID if necessary: [[ $stickyioRetryFormHandler form="custom-retry-form" ]]
.
Form Elements: Ensure the retry form contains elements for entering credit card details, such as the card number, expiration month and year, and CVV.
Navigation Options: Use $stickyioDownsellLink
to provide options for the user to skip the current step or move directly to the order confirmation page.
Displaying products and managing totals efficiently are key to maintaining clarity and accuracy in the checkout process:
Product Display: Use $stickyioCheckout.products
to loop through and render each product with its image, name, SKU, price, and shipping cost. Ensure a hidden input is included to hold the product IDs, which helps in managing the products selected by the customer.
Totals Display: Use $stickyioCheckout
to display shipping, subtotal, and total amounts. This helps customers understand the breakdown of their costs before finalizing their purchase.
{{#each $stickyioCheckout.products}}
<img src="{{ image }}">
<div>{{ product_name }} [ {{ product_sku }} ]</div>
<div>Price: {{ product_price }}</div>
<div>Shipping: {{ shipping_price }}</div>
<div>Total: {{ total }}</div>
<div>Free Trial Days: {{ free_trial_days }}</div>
{{/each}}
Shipping: {{ $stickyioCheckout.shipping_price }}
Subtotal: {{ $stickyioCheckout.subtotal }}
Total: {{ $stickyioCheckout.total }}
{{#each $stickyioOrderDetails.products}}
<div>{{ product_name }} [ {{ product_sku }} ]</div>
<div>Price: {{ product_price }}</div>
<div>Shipping: {{ shipping_price }}</div>
{{/each}}
Shipping: {{ $stickyioOrderDetails.shipping.amount }}
Subtotal: {{ $stickyioOrderDetails.subtotal }}
Total: {{ $stickyioOrderDetails.total }}
<div>
{{ $stickyioOrderDetails.customer.firstName }}
{{ $stickyioOrderDetails.customer.lastName }}
</div>
<div>
{{ $stickyioOrderDetails.customer.shippingAddress1 }}
{{ $stickyioOrderDetails.customer.shippingCity }},
{{ $stickyioOrderDetails.customer.shippingZip }}
</div>
<div>
{{ $stickyioOrderDetails.customer.email }}
</div>
<h3>SHIPPING DETAILS:</h3>
{{#if $stickyioOrderDetails.shipping.name }}
{{ $stickyioOrderDetails.shipping.group_name }}
{{ $stickyioOrderDetails.shipping.description }}
{{else}}
<p>N/A</p>
{{/if}}
Post-purchase pages and subscription management are crucial for enhancing customer satisfaction and encouraging repeat business:
Order Details: Use $stickyioOrderDetails.products
to list each product purchased, along with its details like price and shipping cost. Display total order details using $stickyioOrderDetails.total
.
Customer Information: Display details about the customer, such as their name, address, and email, using $stickyioOrderDetails.customer
.
Subscription Management: Insert the snippet [[ $stickyioSubscriptionManager ]]
on any page to allow customers to manage their subscriptions directly, enhancing user experience and customer retention.
Integrating CBSplit with Sticky.io provides a robust solution for optimizing e-commerce operations. By following the detailed steps for setting up order forms, handling product displays, and managing subscriptions, businesses can enhance their customer journey, improve conversion rates, and ultimately increase revenue. Whether you are a small business owner or a large enterprise, these tools offer the flexibility and efficiency needed to adapt to customer needs and market changes.
Looking for professional A/B testing and optimization services? Contact us to explore how we can help you achieve your goals with CBSplit.