Our platform provides a Website Widget that allows you to sell tickets directly from your own website. You can either display the ticketing widget directly on a page or add a customizable button that opens the widget in a pop-up window.
Both options use the same TicketsCandy checkout and automatically reflect your event and ticket settings.
Accessing the Website Widget #
To access your Website Widget settings:
- Go to your Event Dashboard.
- Click Sell Online > Website Widget in the navigation menu.
At the top of the page, you can choose between two integration options:
- Embed on Page – Displays the ticketing widget directly inside your website page.
- Popup Button – Adds a button to your website that opens the ticketing widget in a pop-up window when clicked.
Embed on Page #
Select Embed on Page if you want your tickets and checkout options to appear directly within a section of your website.
Customize the Widget #
Before adding the widget to your website, you can customize its appearance to better match your website design.
The following options are available:
- Accent Color – Controls the color used for buttons, links, and other action elements throughout the widget.
- Text Color – Controls the main text color within the widget.
- Background Color – Controls the main background container that holds all components of the widget.
- Panel Color – Controls the background of individual panels used to separate different parts of the checkout, such as tickets, custom questions, booking calendars, and other sections.
- Widget Height – Controls how tall the widget appears when embedded on your website. By default, this setting is set to Auto, which automatically adjusts the widget height to match the content displayed inside it. You can change it to Custom to set a fixed height. When Custom is selected, a Height, Px field appears where you can enter the desired height in pixels.
A live preview appears next to the settings so you can see how your changes will look.
Saving and Resetting Widget Colors #
- Reset – Restores the widget colors and height settings to their original defaults.
- Save – Saves your current widget customization.
Color changes are applied automatically to the widget already installed on your website, so you do not need to replace the widget code. However, if you change the Widget Height setting, you will need to copy the updated widget code and replace the existing code on your website for the new height setting to take effect.
Add It to Your Website #
Under Add It To Your Website, copy the complete code provided and paste it into the section of your website where you want the ticketing widget to appear.
If you are using a website builder, add the code through a custom code or HTML code module.
Each event has its own widget code. If you are selling tickets to multiple events, you will need to add the appropriate widget code for each event.
Popup Button #
Select Popup Button if you would rather place a ticket button on your website instead of displaying the full widget directly on the page.
When a customer clicks the button, the TicketsCandy widget opens in a pop-up window, allowing them to select tickets and continue through checkout without leaving your website.
Customize the Button #
The pop-up button has its own customization settings:
- Button Text – Enter the text displayed on the button, such as Buy Tickets.
- Background Color – Choose the button’s background color.
- Font Color – Choose the color of the text displayed on the button.
A live preview shows how your button will appear.
You can use Reset to restore the original button settings or Save to save your changes.
The Popup Button section also includes the complete widget customization settings.
These settings control how the ticketing widget looks after the customer clicks the button and the pop-up opens.
Widget styling is shared between both integration methods. For example, if you change the widget’s accent or panel color, that appearance will be used whether the widget is embedded directly on a page or opened through the pop-up button.
Add the Popup Button to Your Website #
Under Add It To Your Website, copy the complete code provided for the pop-up button and paste it into your website using a custom code or HTML module.
The code creates the button and connects it to the ticketing widget for that specific event.
Adding the Widget to Website Builders #
If you use a website builder, see our detailed setup instructions:
If you use a website builder, see our detailed setup instructions:
