Loyalty

Qué hace esta sección

Customer loyalty: points, tier, progress, redemption and history

Dónde se coloca

• Se puede usar como máximo 1 vez/veces en una página.
• Esta sección viene con el complemento Plugins.plugins.loyalty.name.

Estilos

Distintos aspectos para la misma sección. Puedes cambiar el estilo más tarde; tu contenido se mantiene.

Los primeros 2 estilos de cada sección están abiertos en todas las tiendas. El resto se desbloquea con el complemento Editor de páginas, todos a la vez.

• Full Card

  Gratiscard

  The complete loyalty view — tier badge, points balance, tier progress, lifetime stats, redeem form and points history in one card

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Membership Card

  Gratisgradient

  A tier-coloured gradient membership card with the points balance, tier name and progress — looks like a premium loyalty card

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Member ID Card

  Editor de páginasmembership

  A physical-looking member ID card — tier-coloured face with the member name, "member since", tier and points, plus benefits-style progress beneath

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Progress Ring

  Editor de páginasring

  A gamified circular progress ring with the points in the centre and the climb to the next tier around it

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Reward Hero

  Editor de páginashero

  A bold full-width reward banner — huge points figure, tier, progress and a redeem call-to-action — for the top of a rewards page

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Tier Journey

  Editor de páginastier-progress

  Focuses on the climb — a prominent progress bar to the next tier with the points still needed and lifetime earned

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Stat Tiles

  Editor de páginasstats

  A dashboard grid of tiles — balance, total earned and total redeemed as separate cards — with history beneath

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Compact

  Editor de páginascompact

  Tight card with the tier badge, points balance and progress only — great for a sidebar

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

• Minimal Pill

  Editor de páginasminimal

  A slim pill showing just the points balance and tier — drop it anywhere

  Propios de este estilo: title, showTitle, showIcon, showTierBadge, showMemberInfo, showBalance, showProgress, showLifetime, showRedeem, showTransactions, transactionLimit, accentColor, surfaceColor

Ajustes

Los campos que aparecen en el panel Ajustes de sección, a la derecha, al seleccionar esta sección.

Comunes a todos los estilos

• bg
• contentMaxWidth
• sectionMaxWidth
• horizontalPadding
• verticalPadding
• verticalAlignment
• horizontalAlignment
• horizontalMargin
• verticalMargin
• spacingOverrides
• animationType
• animationDuration
• animationDelay
• animationEasing
• animationStagger
• animationRepeat
• animationParallax
• imageParallax
• animationScrollEffect
• height