Plug-ins and integrations
Tixify Shop - Widget API
23 min
quickstart to get started with using the shop widget, make sure to add the following code to the head or body of your document then, initialize the shop widget with the following code now, reload the page and the shop bubble should be visible in the bottom right corner the shop is now succesfully initialized customizations it's possible to change how some things work margin the widget has a default margin of 16px to the top and bottom of the page however, the possibility exists that this places the widget on top of other components, such as a fixed header or footer by setting a css custom property, these margins can easily be changed (note that the variable needs to be visible by the widget and therefore be either on the root or body level ) z index the widget has a default position on the z axis (z index) of 1050 this value has intentionally been chosen to not be too high as to not limit the developer's options however, by setting a css custom property on the main website, this value can be easily changed (note that the variable needs to be visible by the widget and therefore be either on the root or body level ) notification z index the widget propagates notifications to the host page so they are always visible by default, the z index of these notifications is determined by the z index of the widget itself plus 49, to ensure the notifications appear above the widget however, by setting a css custom property on the main website, this value can be easily changed (note that the variable needs to be visible by the widget and therefore be either on the root or body level ) functions there are multiple functions that can be called to interact with the shop from outside the shop addticket() increases the selection for the specified ticket by 1 syntax parameters guid guid required required the guid of the ticket that needs to be added removeticket() decreases the selection for the specified ticket by 1 syntax parameters guid guid required required the guid of the ticket that needs to be removed addcoupon() adds the specified coupon to the shop checkout syntax parameters code code required required the code of the coupon that needs to be added removecoupon() removes the specified coupon from the shop checkout syntax parameters code code required required the code of the coupon that needs to be removed open() opens the shop widget syntax close() closes the shop widget syntax toggle() toggles the visibility of the shop widget popup syntax events there are multiple events they can be listened to by registering a callback widgettoggled() is called when the widget is opened or closed receives a boolean which indicates if the widget is opened or closed syntax callback parameters name type example value opened boolean cartticketsupdated() is called when the ticket selection changes in the shop receives an object containing the count of selected tickets syntax callback parameters name type example value tickets object ordertotalupdated() is called when the total order price changes in the shop receives the total price formatted according to the shops locale syntax callback parameters name type example value totalprice string € 15,20 rawordertotalupdated() is called when the total order price changes in the shop receives the total price in minor units and the shops currency syntax callback parameters name type example value totalprice integer 1520 currency string eur thanks for reading, if you have feedback or questions about these guides, please contact us at mailto\ support\@tixify live