Component: Add To Basket Offers

Purpose: A display of offers stored on the campaign. Use this Offers component when you want to bring your customers directly to the checkout, or you have multi-quantity offers.

Screenshot_2022-11-10_at_11.19.31.png

Props

Prop Name	Label	Type	Default Value	Description
offerWidth	Card width	number	2	Width of offer cards
shadow	Card shadow	boolean	true	If true a shadow will appear for each card
border	Card border	boolean	false	If true a border will appear for each card
roundCorners	Card round corners	boolean	false	If true each card will have rounded corners
layout	Card layout	picklist	left	Options: center, left, right
offerOverflowLayout	Card alignment	picklist	stretch	Options: stretch, center, start, end
splitByGroups	Group offers?	boolean	false	If true the offers will split by grouping based of the group__limio attribute
imageShape	Image shape	picklist	square	Options: round, default, circle, square. full-width
imagePosition	Image position	picklist	middle	Options: top, middle, bottom
showAllImages	Show all images?	boolean	true
cta_checkout_button_text	CTA go to checkout text	string	Go to checkout	CTA button text
ineligibleMessage	Ineligible for trial message	string	You are not eligible for a trial offer. Please select a different offer to continue.	Ineligible for trial message
thumbnailPosition	Image thumbnail position	picklist	left	Options: center, left, right
detailedPricePosition	Detailed Price position	picklist	top	Options: Top, bottom
mobileSwipe	Mobile swipe or stack?	boolean	true	If true and in mobile view the offers will be swipeable
mobileArrows	Mobile arrows?	boolean	true	If true and in mobile view the arrows will be visible
mobileArrowsColor	Mobile arrows color	color	#505050	Color of the mobile arrows
productSelectText	Product groups text	string	Choose One
showLearnMore	Show learn more	boolean	true	If true the learn more button will be displayed
showQuantityInput	Show Quantity Input Field	boolean	false
learnMoreText	Learn more text	string	Learn more	Learn more text