Integrating Stager Ticket Shops With Your WordPress Site

5 min read
Posted in
  1. Why you'd want to connect your ticket shop
  2. Connect your ticket shop to your site
  3. Displaying ticket shop widgets manually
  4. Disabling the automatic insertion of the Ticket Shop widgets
  5. Using the ā€œStager Ticket Shop Widget" block in the Block Editor
  6. Using the ā€œStager Ticket Shop Widget" Elementor widget in Elementor
  7. Using shortcodes
  8. Troubleshooting

This guide explains how to connect your Stager ticket shops with your WordPress site using the WP Stager Integration plugin. Make sure you have:

šŸ’” Looking for an integration partner who does the full integration for you? Every license comes with a Free Configuration Service, and we also offer a paid Full Integration Service!

Why you’d want to connect your ticket shop

There are a lot of advantages of connecting your ticket shop to your site. The most important ones are:

  • The checkout flow is hosted on your own site, meaning the flow is smoother from a UX perspective. No more jumping between different sites.
  • This increases conversions, allows for a branded environment from start to finish, and a more trustworthy buying experience.
  • Also, this allows for advanced tracking possibilities, since you can implement your tags or pixels.
  • You can design and style the widgets your self, and aren’t limited to the default layouts and styling as provided by Stager.

Customizable ticket shop widgets

Every component of the ticket shop can be styled and rendered the way you want. Adjust colors, typography, and layout to create a truly integrated, on-brand ticket purchasing experience.

Connect your ticket shop to your site

For every Stager ticket shop you wish to connect, follow these steps:

  1. In your WordPress dashboard, go to the WP Stager Integration settings page.
You can find the WP Stager Integration settings in the left-hand sidebar menu in the admin area
  1. Navigate to the Ticket Shops tab.
The ticket shop settings are located under the “Ticket shops” tab
  1. Enter the Stager ticket shop ID of the ticket shop you wish to connect. Copy this from your Stager dashboard ā†’ Settings ā†’ Ticketing ā†’ Ticket shops (tab) ā†’ The ticket shop you wish to connect ā†’ Shop ID.
You can find the Ticket Shop ID in your Stager dashboard, within your ticket shop settings.
  1. Choose an integration type:
    • Advanced ā€“ Fully embedded widgets inside your pages, most native feel.
    • Basic ā€“ A fullscreen Stager-powered checkout page.
  2. For ticket shops with the Basic integration type, select an “Order” (checkout) page. For ticket shops with the Advanced integration type, also select a “Basket” (cart) page.
  3. Click Save settings. The shop should then show as connected in the plugin.
Enter the new ticket shop details and click “Save settings”.
  1. After adding your ticket shop to your site, you have to log into your Stager dashboard and add the displayed settings to your ticket shop in your Stager dashboard:
    • Make sure the Widget integrations is set to Enabled.
    • Copy and paste the displayed values for
      • Domain
      • Successful return URL
      • Failed return URL
After saving your settings, the settings to add to your ticket shop in your Stager dashboard are displayed in the blue-highlighted section.
Enter the settings in your ticket shop settings in your Stager dashboard.

That’s it! Your ticket shops are now connected. Event pages will now automatically render the ticket shop widgets, and the selected Cart and Checkout pages will display the respective Basket and Order widgets.

Displaying ticket shop widgets manually

For ticket shops with the Advanced integration type, the (advanced) ticket shop widgets are automatically inserted into the page by default. This means you only have to connect your ticket shop following the steps above, and the respective widgets will be displayed automatically:

  • The Event widget is displayed on the event pages.
  • The Basket widget is displayed on the chosen “Cart” page.
  • The Order widget is displayed on the chose “Checkout” page.

For ticket shops with the Basic integration type, the event pages show a “Buy tickets” link, which redirects users to the chosen “Cart” page, on which the full screen embedded (basic) widget is displayed.

If, however, you wish to create a custom layout or insert the widget yourself, there are multiple options available.

Disabling the automatic insertion of the Ticket Shop widgets

You can choose to disable the automatic insertion of the Ticket Shop widgets on the Cart (basket) or Checkout (order) pages through the WP Stager Integration settings ā†’ Ticket shops (tab) ā†’ “Automatically insert widgets” setting. Here you can enable/disable it for both pages separately.

Using the ā€œStager Ticket Shop Widget” block in the Block Editor

You can use the Stager Ticket Shop Widget block to render a ticket shop widget through the Block Editor. This block allows you to choose a widget type, which will be rendered wherever the block is inserted. The block offers settings to modify the options of the widget.

šŸ’” When the Stager Ticket Shop Widget block is used on the chosen “Checkout” or “Cart” pages, then the widgets will no longer by injected into the content by default, but they will be rendered by the inserted block instead.

Using the ā€œStager Ticket Shop Widget” Elementor widget in Elementor

You can use the Stager Ticket Shop Widget Elementor widget to render a ticket shop widget in the Elementor editor. This widget allows you to choose a widget type, which will be rendered wherever the widget is inserted. The Elementor widget offers settings to modify the options of the Ticket Shop widget.

šŸ’” When using the Stager Ticket Shop Widget Elementor widget, make sure that the automatic insertion of these widgets is disabled to prevent it from loading twice on the page. See the chapter above on how to disable the automatic insertion.

Using shortcodes

If you prefer or need to use shortcodes (e.g. in a classic widget or a custom field), you can use the wpstager_ticket_shop_widget shortcode. The shortcode accepts a type attribute, which determins the type of widget being rendered (basic, basket, event, or order). It also accepts any option that can be passed to the widget initialization function as a “snake_case” attribute. Some examples of how you can use this shortcode:

// This will render the (advanced) basket widget (which is the default)
[wpstager_ticket_shop_widget] // or:
[wpstager_ticket_shop_widget type="basket"]

// This will render the (advanced) event widget.
// On single event pages, the event ID is automatically retrieved from the currently viewed event.
[wpstager_ticket_shop_widget type="event"]

// This will render the order widget
[wpstager_ticket_shop_widget type="order"]

// This will render the "basic" widget, embedded, and loading the events page
[wpstager_ticket_shop_widget type="basic" render_type="embedded" initial_load_page="events"]

Paste one of these shortcodes into any page, post, or widget area and save. Visit the page on the front end to confirm the widget loads correctly.

šŸ’” When the wpstager_ticket_shop_widget shortcode is used on the chosen “Checkout” or “Cart” pages, then the widgets will no longer by injected into the content by default, but they will be rendered by the inserted shortcode instead.

šŸ’” Please refer to the Shortcode documentation for all examples and information on this shortcode. Refer to Stager’s Basic ticket shop widget documentation and Advanced ticket shop widget documentation for available widget options.

Troubleshooting

Check that ticket shops are enabled and correctly configured in the plugin settings. Confirm the shop ID is correct and the integration type matches how youā€™re trying to use it.

Verify that events and tickets areĀ correctlyĀ set up inĀ Stager. MakeĀ sure the eventĀ youā€™reĀ testingĀ is linked toĀ theĀ correct ticket shop.

ConfirmĀ theĀ order pageĀ URLĀ isĀ set correctly in theĀ plugin. Temporarily disable caching or optimization plugins to rule out script blocking.

The Order and Basket widgets are inserted automatically on their respective chosen pages by default. If you manually add it to a page, then it could get rendered twice if you’re using Elementor, or if you’re manually adding the widget somewhere programatically (using code or a shortcode for example). You can enable/disable the automatic insertion for both pages separately through the WP Stager Integration settings ā†’ Ticket shops (tab) ā†’ “Automatically insert widgets” setting. Make sure to disable it on the pages where you manually add the widgets.

With these steps, you can quickly get your Stager ticket shops up and running on your WordPress site, either as embedded widgets or as a clean fullscreen checkout experience.

šŸ’” Looking for an integration partner who does the full integration for you? Every license comes with a Free Configuration Service, and we also offer a paid Full Integration Service!

Get WP Stager Integration

šŸŽ Limited offer: Use code WELCOME26 to get your first month for free!

Get started