An example Member Card Element
The Member Card Element provides a digital loyalty card, with content personalised to the authenticated user. It is primarily intended to be used on a mobile device and for use in physical store and locations to link a customers profile to a transaction.
To include the Member Card Element on a webpage do the following:
- Add the following script tags at the top of the page
<script type="module" src="https://elements.spaaza.com/elem/spaaza-environment.js"></script> <script type="module" src="https://elements.spaaza.com/elem/spaaza-member-card.js"></script>
- Add the Environment tag to the contents of the page (below the script tags). Include the Member Card within the Environment tag
<spaaza-environment config="your_config_goes_here"> <spaaza-member-card cardimage="https://example.com/image" backcolor="rgb(144,28,53)" textcolor="white" type="block" width="300px"> </spaaza-member-card> <!-- other Spaaza Elements and HTML goes here --> </spaaza-environment>
The following properties can be passed to the Member Card.
|cardimage||The URL of an image to show as an icon on the digital card. The image must be avaible on a publicly available address and should be smaller than 100 kilobytes.|
|backimage||The URL of a background image to show on the digital card. The image must be avaible on a publicly available address and should be smaller than 100 kilobytes.|
|backcolor||The background color of the card.|
|textcolor||The color of the text on the card.|
|width||The width of the card. Valid CSS “width” values are supported - for example 100%, 300px etc.|
|appearance (optional)||Determines the card display style. There are two options: “flat” or “raised”. The default is “raised”.|