Here’s a test of the OTS Widget using Niagara Arts & Cultural Center’s widget. Here’s the code we’re embedding.
This goes in the <head> of the document. I’m using the CodeSnippets plugin and inserting this globally:
<script>(function(){window.ONTHESTAGE_API_KEY='eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiI2NjA3MDBlZDU0MmU4NTA0Njg5MDdhMmEiLCJlbWFpbCI6IndpZGdldF9hcGlAbmlhZ2FyYS1hcnRzLWFuZC1jdWx0dXJhbC1jZW50ZXIuY29tIiwib3JnYW5pemF0aW9uIjoiNjU4ZWViMTY3NzFmMzAwZTNiYjNlZmZiIiwib3JnX3NsdWciOiJuaWFnYXJhLWFydHMtYW5kLWN1bHR1cmFsLWNlbnRlciIsInJvbGVzIjpbIndpZGdldF9hcGkiXSwiaWF0IjoxNzEyNDUzNjA4LCJleHAiOjE3NDM5ODk2MDh9.pjNNjwRLUOLtHoDU5Oo_5tzTH5isQBJF5asF9Vz-Us0';var otswidget_js_esm = document.createElement('script');otswidget_js_esm.setAttribute('type', 'module');otswidget_js_esm.setAttribute('src', 'https://cdn.onthestage.tickets/prod-v2/ots-widgets.esm.js');document.head.appendChild(otswidget_js_esm);var otswidget_js = document.createElement('script');otswidget_js.setAttribute('src', 'https://cdn.onthestage.tickets/prod-v2/ots-widgets.js');otswidget_js.setAttribute('nomodule', '');document.head.appendChild(otswidget_js);var otswidget_css = document.createElement('link');otswidget_css.setAttribute('rel', 'stylesheet');otswidget_css.setAttribute('href', 'https://cdn.onthestage.tickets/prod-v2/ots-widgets.css');document.head.appendChild(otswidget_css);
}());</script>Then in the body of the WordPress page this widget code is inserted using a custom HTML block:
<onthestage-widget organization-id="658eeb16771f300e3bb3effb" modal="true" widget-style="list" production-id="6606f93b2f4cca0e422616bf"></onthestage-widget>
<button data-onthestage-production-id="6606f93b2f4cca0e422616bf">Buy Tickets</button>