Constell Widget: Example

Switch locales

• Switch to Dutch
• Switch to English

Theme the widget

Set Venue ID

Switch position

• Top left
• Top center
• Top right
• Bottom right
• Bottom center
• Bottom left

All possible attributes:

• venue: [string] Required, the UUID of the Constell Venue
• locale: [string] Optional, defaults to nl. Should be one of the available locales of the venue.
• position: [enum] Optional, defaults to bottom-right. Determines the placement of the button. Possible values:
  • bottom-right (default)
  • bottom-center
  • bottom-left
  • top-right
  • top-center
  • top-left
• offset-x: [integer] Optional, this will push the button along the x-axis by the amount of pixels indicated in the attribute.
  Mind you, when using position=bottom-left it will push the button to the right. For position=bottom-right it will push it to the left.
  Also, it does nothing when the button is centered.
• offset-y: [integer] Optional, this will push the button along the y-axis by the amount of pixels indicated in the attribute.
  Mind you, when using position=top-left it will push the button down. For position=bottom-left it will push it up.
• button-label: [string] Optional, will change the label on the button when the widget is closed and users need to click the button to open.
• button-label-close: [string] Optional, will change the label on the button when the widget is open. Defaults to 'Close'.
• brand-color: [string] Optional, defaults to Constell brand style. Should be a valid CSS color value.
• force-text-color: [enum] Optional, force the text color on the brand themed elements (button, header).
  PLEASE NOTE: this property should not need to be set, the widget will try to automatically determine the text color based on the brand color.
  Possible values:
  • dark
  • light