Component: Switch Subscription
Purpose: Use this component to create a Page that confirms a change to a subscription (e.g. cancel/save offer accepted, or change offer).
The component includes 2 steps:
Offer selection
Modal to confirm the changes
The component includes the following abilities:
Group: Ability to group Offers based on the Offer group attribute.
Display:
Show the data of the offers attributes, such as Display Price, Offer Features, and CTA.
Hide offers that are of the same term (e.g. hide Monthly offer if the customer is already on a Monthly offer).
Sort: Modifying the order of the Offers being displayed.
Payment: Display the Payment Method which will be used for the update Subscription.
Delivery: If the switch is to a product that includes Has Delivery = true, then the customer will be prompted to confirm the delivery address.
Block: Block switch to other products if those are not allowed online.
You should also create a separate page to confirm success of the changes, using the Order Change Success component will require configuration also of the Switch Offer. Switch Offers are very similar to other offers, but you must configure a Switch Date (the effective date of the switch). Learn more at How to create a personalised switch experience with Switch Offers
Considerations for this component:
Note: If reCAPTCHA is enabled on your site, it will perform checks on pages which use this component. Read more:
1. Offer selection
Card layout
Radio button layout
2. Confirmation of changes
| ⚠️ Known limitation: If you are using Initial Price on Limio Offers and want to process an immediate switch, the Payment Amount will not show any credit/proration. It will show the full charge of the new Limio Offer selected. This limitation does not apply if you are using External Pricing. However we do not recommend you use external price on a Switch Offer if the initial Offer is on Initial Pricing. Learn more about Initial/External Pricing . |
Props
Key properties to configure are highlighted in Bold.
id
label
type
default
options/infos
splitByGroups
Split offers by groups?
boolean
FALSE
Display of offers by groups, if groups are setup on the Offer
layout
Layout
picklist
cards
Display of offers in either Card or Radio Button layout
preselectFirstOfferInGroup
Preselect first offer in each group
boolean
FALSE
If true, first offer in each group will be preselected.
heading
Heading
string
Alternative subscriptions
subheading
Subheading
string
contactNumber
Contact Number
string
defaultImageUrl
Default Image Url
string
shadow
Shadow?
boolean
FALSE
Design settings
roundedCorners
Rounded Corners?
boolean
FALSE
Design settings
imagePosition
Image Position
picklist
middle
Defines the position of the image, if there is an attachment on the Offer
redirectUrl
Redirect Url
string
/mma
Redirect URL if the switch is processed successfully, for example /mma or a /switch-success page using the Component: Order Change Success
confirmSubheading
Confirm Sub Heading
string
You will be switched over to this offer, starting your next billing date:
If the confirmation modal is configured, this subheading text will show.
confirmationOk
Confirmation Ok label
string
OK
confirmationCancel
Confirmation Cancel label
string
Cancel
confirmationReturn
Confirmation Return label
string
Return to my account
filterSameTerm
Filter same term offers?
boolean
FALSE
If true, hide switch offers that are within the same group and term than the offer of the current subscription For example, hide montly print offers if the subscriber already has a monthly print offer. This feature uses the Limio Offer Term and Group attributes, which must match between the acquisition and switch offer.
blockProductSwitch
Block switch to offers with different products?
boolean
FALSE
Block switch attempt to a product that is different from the original product. This will display a message to contact customer service and will not allow to process a switch.
showDescription
Show description?
boolean
FALSE
Show a product description
confirmAddressLabel
Address confirmation label
string
Use this address:
deliveryCompanyLabel
Delivery company label
string
Company
deliveryAddress1Label
Delivery address line 1 label
string
Address line 1
deliveryAddress2Label
Delivery address line 2 label
string
Address line 2
deliveryCityLabel
Delivery city label
string
City
deliveryStateLabel
Delivery state label
string
{{state_name_type}}
Use this pattern to be able to have a regionally accurate label i.e. State for US, Country for GB etc.
deliveryPostalCodeLabel
Delivery postal code/ZIP code label
string
{{zip_name_type}}
Use this pattern to be able to have a regionally accurate label i.e. Zip Code for US, Postal Code for GB etc.
deliveryCountryLabel
Delivery country label
string
Country
invalid DeliveryCountryMessage
Invalid delivery country message
string
Please choose a different country
Displayed if validation fails for this field
invalidAddressMessage
Invalid address message
string
Address is required
Displayed if validation fails for this field
invalidCityMessage
Invalid city message
string
City is required
Displayed if validation fails for this field
invalidStateMessage
Invalid state/county message
string
{{state_name_type}} is required
Displayed if validation fails for this field Use this pattern to be able to have a regionally accurate label i.e. State for US, Country for GB etc.
invalid PostalCodeMessage
Invalid zip/postal code message
string
{{zip_name_type}} is required
Displayed if validation fails for this field Use this pattern to be able to have a regionally accurate label i.e. Zip Code for US, Postal Code for GB etc.e
invalidCountryMessage
Invalid city message
string
Country is required
Displayed if validation fails for this field
showPaymentMethod
Show payment method?
boolean
FALSE
If enabled, payment method which will be used on the new subscription will be displayed on the confirmation dialog.
paymentMethodHeading
Payment method heading
string
Payment Method
Will only be displayed if "Show payment method?" is enabled
paymentFrequencyLabel
Payment frequency label
string
Payment Frequency
Will only be displayed if "Show payment method?" is enabled
paymentAmountLabel
Payment amount label
string
Payment Amount
Will only be displayed if "Show payment method?" is enabled
paymentDateLabel
Payment date label
string
Payment Date
Will only be displayed if "Show payment method?" is enabled
showOfferFeatures
Show offer features?
boolean
FALSE
If enabled, the offer features will be displayed on the confirmation modal
allowAddressChange
Display address information?
boolean
TRUE
If enabled, the customer can change their address while switching their subscription
confirmationText
Confirmation Text
richtext
If present, this Confirmation Text will be displayed on the confirmation modal
contactText
Contact Text
richtext
This rich text field allows users to add links to the confirmation modal, which can be helpful to redirect customers to contact methods.
processErrorMessage
Switch process error message
string
Something went wrong and we weren't able to process your switch. Please contact our support team.
If a switch is not processed successfully, this message will alert the customer.
componentId
Component Id
string
switch-offers-limio
Last updated
Was this helpful?