Skip to content
Basker Docs
Themes APIs

Spektrix Integration

Spektrix is a ticketing and CRM system for arts and entertainment venues. Basker provides Liquid tags to embed Spektrix widgets and generate booking links directly in your theme.

Prerequisites

Section titled “Prerequisites”

Before using Spektrix tags:

  1. Spektrix account with API access configured
  2. Spektrix app enabled in Basker CMS
  3. Connection details configured (client name, custom domains)

Iframe Widget Tags

Section titled “Iframe Widget Tags”

These tags render embedded Spektrix iframe widgets for ticketing functionality.

spektrix_iframe_event_list tag

Section titled “spektrix_iframe_event_list ”

Renders the Spektrix event list widget showing all available events.

Syntax:

{% spektrix_iframe_event_list %}

Output:

<iframe src="https://system.spektrix.com/clientname/website/EventList.aspx?resize=true"
        name="SpektrixIFrame" id="SpektrixIFrame" frameborder="0"
        style="width: 100%; height: 1000px;"></iframe>

Example Usage:

<section class="events-listing">
  <h2>What's On</h2>
  {% spektrix_iframe_event_list %}
</section>

spektrix_iframe_event_calendar tag

Section titled “spektrix_iframe_event_calendar ”

Renders the Spektrix event calendar widget showing events in a calendar view.

Syntax:

{% spektrix_iframe_event_calendar %}

Example Usage:

<section class="events-calendar">
  <h2>Event Calendar</h2>
  {% spektrix_iframe_event_calendar %}
</section>

spektrix_iframe_basket tag

Section titled “spektrix_iframe_basket ”

Renders the Spektrix shopping basket widget.

Syntax:

{% spektrix_iframe_basket %}

Example Usage:

{# In a basket/checkout page #}
<main class="basket-page">
  <h1>Your Basket</h1>
  {% spektrix_iframe_basket %}
</main>

spektrix_iframe_account tag

Section titled “spektrix_iframe_account ”

Renders the Spektrix account management widget for logged-in users.

Syntax:

{% spektrix_iframe_account %}

Example Usage:

{# In an account management page #}
<main class="account-page">
  <h1>My Account</h1>
  {% spektrix_iframe_account %}
</main>

spektrix_iframe_event_details tag

Section titled “spektrix_iframe_event_details ”

Renders the Spektrix event details widget for a specific event. This tag only works on event pages where the event has a linked Spektrix event ID.

Syntax:

{% spektrix_iframe_event_details %}

Requirements:

  • Must be used on an event template
  • Event must have spektrix.eventId set in custom attributes

Example Usage:

{# In templates/event.liquid #}
{% if event.spektrix.eventId %}
  <section class="ticket-selection">
    <h2>Select Tickets</h2>
    {% spektrix_iframe_event_details %}
  </section>
{% endif %}
Section titled “Link Generation Tags”

These tags generate URLs to Spektrix pages (requires Spektrix subsite configuration).

Section titled “spektrix_subsite_booking_link ”

Generates a direct booking link for the current event. Only works on event pages with a linked Spektrix event ID.

Syntax:

{% spektrix_subsite_booking_link %}

Output: A URL string (e.g., https://tickets.example.com/EventAvailability?EventId=12345&ref=bookNow&scroll=timeAndDates)

Example Usage:

{% if event.spektrix.eventId %}
  <a href="{% spektrix_subsite_booking_link %}" class="btn btn--primary">
    Book Tickets
  </a>
{% endif %}
Section titled “spektrix_subsite_account_link ”

Generates a link to the Spektrix account page.

Syntax:

{% spektrix_subsite_account_link %}

Output: A URL string (e.g., https://tickets.example.com/MyAccount)

Example Usage:

<a href="{% spektrix_subsite_account_link %}" class="nav-link">
  My Account
</a>

Configuration

Section titled “Configuration”

Spektrix tags use configuration from your tenant’s Spektrix app settings:

SettingDescription
connectionDetails.clientNameYour Spektrix client name
spektrixWidgets.customDomainCustom domain for iframe widgets (default: system.spektrix.com)
spektrixSubsite.customDomainCustom domain for booking links (required for link tags)

Complete Example

Section titled “Complete Example”

Here’s a complete event page template with Spektrix integration:

{% layout 'layouts/default.liquid' %}


{% capture content_for_layout %}
<article class="event-page">
  <header class="event-header">
    <h1>{{ event.title }}</h1>
    <p class="event-dates">
      {{ event.startDate | date: '%B %d, %Y' }}
      {% if event.venue %}at {{ event.venue.name }}{% endif %}
    </p>
  </header>


  {# Event content blocks #}
  {% stageblocks event %}


  {# Spektrix ticketing section #}
  {% if event.spektrix.eventId %}
    <section class="ticket-section">
      <h2>Get Tickets</h2>


      {# Option 1: Embedded widget #}
      <div class="ticket-widget">
        {% spektrix_iframe_event_details %}
      </div>


      {# Option 2: Direct booking link #}
      <div class="ticket-cta">
        <a href="{% spektrix_subsite_booking_link %}" class="btn btn--large">
          Book Now
        </a>
      </div>
    </section>
  {% endif %}
</article>
{% endcapture %}