1. Install Our Software Developer Kit

In order for the widget to function properly, you're going to add some code into the header of your website.

1. Select Settings > Advanced > Code Injection

2. Then, post the following code into the header field 

<script type="text/javascript">
(function (window, document, src) {
  var config = window.__shwps;
  if (typeof config === "undefined") {
    config = function () {
      config.c(arguments)
    };
    config.q = [];
    config.c = function (args) {
      config.q.push(args)
    };
    window.__shwps = config;

    var s = document.createElement('script');
    s.type = 'text/javascript';
    s.async = true;
    s.src = src;
    var x = document.getElementsByTagName('script')[0];
    x.parentNode.insertBefore(s, x);
  }
})(window, document, 'https://www.showpass.com/static/dist/sdk.js');
</script>

2. Add the Button to Your Pages

To add the button to a page on your site: 

1. After creating an event, Copy your Slug (aka the portion of the URL that comes after showpass.com). You can find this right next to the Event Name when editing your event or in the address bar of your event page. 

2. On the page you'd like to add the button to, select the Tear Drop icon to add a new section

3. Click Code

4. Insert the following code, changing INSERT-EVENT-SLUG with your previous copied Slug in Step 1:

<div class="sqs-block button-block sqs-block-button" data-block-type="53"><div class="sqs-block-content">
<div class="sqs-block-button-container--center" data-alignment="center" data-button-size="medium">
    <a href="#" onclick="showpass.tickets.eventPurchaseWidget('INSERT- EVENT-SLUG', {'theme-primary': '#ED0D0D', 'keep-shopping': true})" class="sqs-block-button-element--medium sqs-block-button-element" data-initialized="true">Buy Tickets</a>
</div></div></div>

Related Articles

Need more help? Chat with us by selecting the red icon on the bottom right of your screen

Did this answer your question?