Skip to main content

Adding the Widget to Your Wordpress Site

Need to add the widget to you Wordpress site? Here's how to do it.

Updated over a week ago

Our easy-to-use, customizable ticketing widget automatically creates an embeddable purchase flow for every show that includes an embeddable calendar or list view of all events populated with live data in real time. With dynamic data, you'll be able to drive patron urgency to purchase when inventory is low.

Embedding the OTS widget in your Wordpress page lets you:

  • Streamline ticket bookings or event discovery—users can view and reserve performances directly on your site.

  • Enhance user experience—visitors stay on your brand’s site while engaging with your event calendar.

  • Boost conversions—in-line access typically results in higher engagement and ticket sales.

Click for instructions for GoDaddy, Wix or Squarespace sites.

šŸ‘ŸWalk Through

After whitelisting your domain as instructed above you will need to add the widget code to the <head> tag of your website. The easiest way for most users to do this is by using a ā€œcode snippetsā€ plugin rather than editing your theme files directly. We recommend WPCode Lite, which is a free plugin.

You will create two code snippets to add the widget to your site. First, after installing the plugin, select ā€œAdd Snippetā€ and then choose ā€œAdd Your Custom Codeā€ option. Paste the script you copied from the OTS admin site into the Code Preview box. Make sure Type is set to ā€œHTML Snippetā€, Insert Method is ā€œAuto Insertā€ and the Location is ā€œSite Wide Headerā€. Click the Update button to proceed.

Create a shortcode for the actual widget embed itself. Click ā€œAdd Snippetā€ from the side bar and choose the ā€œAdd Your Custom Codeā€ option again. You will paste the code reference from the OTS admin screen into the Code Preview box. Make sure Type is set to ā€œHTML Snippetā€, Insert Method is ā€œShortcodeā€. The plugin will automatically generate a shortcode for you. Click the Update button to proceed.

On the page where you would like to embed the widget, choose the Shortcode block type and insert the shortcode generated in the previous step. Note: Your editing interface may look different depending on whether you are using the default Gutenberg editor, the classic Wordpress editing experience, or a more advanced plugin like WPBakery Page Builder.


šŸŽ“ Recap: Wordpress Widget Integration

This article guides you through embedding the On The Stage ticket widget into a WordPress site using a plugin like WPCode Lite. First, whitelist your domain in the Widget Configuration dashboard. Then, create two code snippets in the plugin: one for the initialization script (site-wide header) and another as a shortcode for the widget embed. Finally, place the shortcode in a WordPress block where you’d like the widget to appear—no theme file editing required.

šŸš€ Best Practices for WordPress Widget Integration

  1. šŸ›”ļø Whitelist all relevant domains first
    Add both your site’s live and staging/test domains in the Widget Configuration to ensure the widget loads in every environment.

  2. šŸ”Œ Use a reputable code snippet plugin
    Opt for WPCode Lite or a similar trusted plugin to embed scripts safely and avoid direct theme file modifications.

  3. 🧩 Separate initialization and widget shortcode
    Keep the header script and widget shortcode in different snippets—this ensures proper loading and easier troubleshooting .

  4. šŸ“„ Place shortcode in the correct block
    Insert the generated shortcode in a Shortcode or Custom HTML block (Gutenberg, Classic, or page-builder) exactly where you want the widget to display.

  5. šŸ‘€ Test before going live
    Preview the page to confirm the widget renders correctly, then publish and re-test on both desktop and mobile to guarantee full functionality.

Did this answer your question?