Member Card Element
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="full"> </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.|
|cardbackcolor||The background color of the card.|
|textcolor||The color of the text on the card.|
|type||The appearance of the card. Supported values are: |
“block”: the card is displayed with square corners
“flat”: the card is displayed with rounded corners
“raised”: the card is displayed with rounded corners and with a box shadow.
|width||The width of the card. Supported values are: |
“full”: the card will take up the full value of it’s container
“constrained”: the card will have a maximum width of 350px