Basker Docs

Season template

Reference for the season object — programming-cycle groupings

The season template renders season pages that organize events into time-based groupings. A season typically represents a programming year (e.g., "2024-25 Season") and contains events that occur within that timeframe.

Location

└── theme
    └── templates
        └── season.liquid

The season Object

The season template has access to the season object with these properties:

Core Properties

PropertyTypeDescription
idstringUnique identifier
titlestringSeason name (e.g., "2024-25 Season")
descriptionstringSeason description
slugstringURL-safe identifier
imagemediaMain season image

Date Properties

PropertyTypeDescription
startDatestringSeason start date (ISO 8601)
endDatestringSeason end date (ISO 8601)

Relationships

PropertyTypeDescription
eventsarrayEvents in this season

Content

PropertyTypeDescription
blocksarrayContent blocks
customAttributesobjectCustom attribute values
themeobjectTheme-specific field values

Metadata

PropertyTypeDescription
meta.titlestringSEO title
meta.descriptionstringSEO description
meta.imagemediaSEO/OG image
createdAtstringCreation timestamp
updatedAtstringLast update timestamp

Basic Template Example

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

{% capture content_for_layout %}
<article class="season">
  <header class="season-header">
    {% if season.image %}
      <img
        src="{{ season.image | image_url: width: 1200, height: 600 }}"
        alt="{{ season.image.alt | default: season.title }}"
        class="season-header__image"
      >
    {% endif %}

    <div class="season-header__content">
      <h1>{{ season.title }}</h1>

      {% if season.description %}
        <p class="lead">{{ season.description }}</p>
      {% endif %}

      {% if season.startDate %}
        <p class="season-dates">
          {{ season.startDate | date: '%B %Y' }}{{ season.endDate | date: '%B %Y' }}
        </p>
      {% endif %}
    </div>
  </header>

  <div class="season-body">
    {% stageblocks season %}
  </div>
</article>
{% endcapture %}

Working with Season Dates

Season Year Range

{# Display as "2024-25 Season" format #}
{% assign start_year = season.startDate | date: '%Y' %}
{% assign end_year = season.endDate | date: '%y' %}

<span class="season-year">{{ start_year }}-{{ end_year }} Season</span>

Full Date Range

<p class="season-dates">
  {{ season.startDate | date: '%B %d, %Y' }}{{ season.endDate | date: '%B %d, %Y' }}
</p>

Duration Check

{# Check if season is current #}
{% assign now = 'now' | date: '%s' %}
{% assign season_start = season.startDate | date: '%s' %}
{% assign season_end = season.endDate | date: '%s' %}

{% if now >= season_start and now <= season_end %}
  <span class="badge badge--current">Current Season</span>
{% elsif now < season_start %}
  <span class="badge badge--upcoming">Upcoming</span>
{% else %}
  <span class="badge badge--past">Past Season</span>
{% endif %}

Working with Season Events

List All Season Events

{% if season.events.size > 0 %}
  <section class="season-events">
    <h2>{{ season.title }} Events</h2>

    <div class="event-grid">
      {% for event in season.events %}
        <article class="event-card">
          {% if event.image %}
            <img
              src="{{ event.image | image_url: width: 400, height: 250 }}"
              alt="{{ event.title }}"
              loading="lazy"
            >
          {% endif %}

          <div class="event-card__content">
            <h3>
              <a href="/events/{{ event.slug }}">{{ event.title }}</a>
            </h3>

            {% if event.startDate %}
              <time datetime="{{ event.startDate }}">
                {{ event.startDate | date: '%B %d, %Y' }}
              </time>
            {% endif %}

            {% if event.venue %}
              <p class="venue">{{ event.venue.name }}</p>
            {% endif %}
          </div>
        </article>
      {% endfor %}
    </div>
  </section>
{% endif %}

Events Grouped by Month

{% if season.events.size > 0 %}
  <section class="season-calendar">
    <h2>Season Calendar</h2>

    {% assign current_month = '' %}
    {% for event in season.events %}
      {% assign event_month = event.startDate | date: '%B %Y' %}

      {% if event_month != current_month %}
        {% unless current_month == '' %}
          </div>
        {% endunless %}
        <h3 class="month-header">{{ event_month }}</h3>
        <div class="month-events">
        {% assign current_month = event_month %}
      {% endif %}

      {% render 'components/event-item' event: event %}

      {% if forloop.last %}</div>{% endif %}
    {% endfor %}
  </section>
{% endif %}

Events by Series

{# Group events by their series #}
{% if season.events.size > 0 %}
  <section class="season-by-series">
    {% assign events_by_series = season.events | group_by: 'series.title' %}

    {% for group in events_by_series %}
      <div class="series-group">
        <h3>{{ group.name | default: 'Other Events' }}</h3>
        <div class="event-list">
          {% for event in group.items %}
            {% render 'components/event-item' event: event %}
          {% endfor %}
        </div>
      </div>
    {% endfor %}
  </section>
{% endif %}

Working with Theme-Specific Fields

Access custom fields defined in the template schema via season.theme:

{# Template schema defines: season_brochure, subscription_packages, season_announcement_html #}

{% if season.theme.season_announcement_html %}
  <div class="season-announcement">
    {{ season.theme.season_announcement_html }}
  </div>
{% endif %}

{% if season.theme.season_brochure %}
  <a href="{{ season.theme.season_brochure | file_url }}" class="btn btn--secondary" download>
    Download Season Brochure
  </a>
{% endif %}

{% if season.theme.subscription_packages.size > 0 %}
  <section class="subscription-packages">
    <h2>Subscription Packages</h2>
    {% for package in season.theme.subscription_packages %}
      <div class="package-card">
        <h3>{{ package.name }}</h3>
        <p>{{ package.description }}</p>
        {% if package.link %}
          <a href="{{ package.link }}" class="btn">Learn More</a>
        {% endif %}
      </div>
    {% endfor %}
  </section>
{% endif %}

Complete Template Example

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

{% capture content_for_layout %}
<article class="season-page">
  {# Hero section #}
  <header class="season-hero">
    {% if season.image %}
      <picture class="season-hero__image">
        <source
          media="(min-width: 768px)"
          srcset="{{ season.image | image_url: width: 1920, height: 700 }}"
        >
        <img
          src="{{ season.image | image_url: width: 800, height: 500 }}"
          alt="{{ season.image.alt | default: season.title }}"
        >
      </picture>
    {% endif %}

    <div class="season-hero__content">
      <h1>{{ season.title }}</h1>

      {% if season.startDate %}
        <p class="season-hero__dates">
          {{ season.startDate | date: '%B %Y' }}{{ season.endDate | date: '%B %Y' }}
        </p>
      {% endif %}

      {% if season.description %}
        <p class="lead">{{ season.description }}</p>
      {% endif %}

      <div class="season-hero__actions">
        {% if season.theme.subscription_link %}
          <a href="{{ season.theme.subscription_link }}" class="btn btn--primary">
            Subscribe Now
          </a>
        {% endif %}

        {% if season.theme.season_brochure %}
          <a href="{{ season.theme.season_brochure | file_url }}" class="btn btn--secondary" download>
            Season Brochure
          </a>
        {% endif %}
      </div>
    </div>
  </header>

  {# Season announcement if present #}
  {% if season.theme.season_announcement_html %}
    <section class="season-announcement">
      {{ season.theme.season_announcement_html }}
    </section>
  {% endif %}

  {# Content blocks #}
  <div class="season-content">
    {% stageblocks season %}
  </div>

  {# Events listing #}
  {% if season.events.size > 0 %}
    <section class="season-events">
      <header class="season-events__header">
        <h2>Season Events</h2>
        <p class="event-count">{{ season.events.size }} events this season</p>
      </header>

      <div class="event-grid">
        {% for event in season.events %}
          <a href="/events/{{ event.slug }}" class="event-card">
            {% if event.image %}
              <img
                src="{{ event.image | image_url: width: 400, height: 250 }}"
                alt="{{ event.title }}"
                class="event-card__image"
                loading="lazy"
              >
            {% endif %}

            <div class="event-card__content">
              <h3 class="event-card__title">{{ event.title }}</h3>

              {% if event.startDate %}
                <time class="event-card__date" datetime="{{ event.startDate }}">
                  {{ event.startDate | date: '%B %d, %Y' }}
                </time>
              {% endif %}

              {% if event.venue %}
                <p class="event-card__venue">{{ event.venue.name }}</p>
              {% endif %}

              {% if event.series %}
                <span class="event-card__series">{{ event.series.title }}</span>
              {% endif %}
            </div>
          </a>
        {% endfor %}
      </div>
    </section>
  {% endif %}

  {# Navigation #}
  <nav class="season-nav">
    <a href="/seasons" class="back-link">
      &larr; All Seasons
    </a>
  </nav>
</article>
{% endcapture %}

{% schema %}
{
  "name": "season",
  "settings": [
    {
      "type": "text",
      "name": "subscription_link",
      "label": "Subscription Link"
    },
    {
      "type": "upload",
      "name": "season_brochure",
      "label": "Season Brochure (PDF)",
      "relationTo": "media"
    },
    {
      "type": "richText",
      "name": "season_announcement",
      "label": "Season Announcement"
    },
    {
      "type": "array",
      "name": "subscription_packages",
      "label": "Subscription Packages",
      "fields": [
        { "type": "text", "name": "name", "label": "Package Name" },
        { "type": "textarea", "name": "description", "label": "Description" },
        { "type": "text", "name": "link", "label": "Link" }
      ]
    }
  ],
  "blocks": [
    "accordion",
    "content",
    "feature-panel",
    "image-gallery",
    "well"
  ]
}
{% endschema %}

Alternate Season Templates

Create variations for different season presentations:

templates/
├── season.liquid           # Default season template
├── season.archive.liquid   # Past season archive view
├── season.preview.liquid   # Upcoming season preview
└── season.calendar.liquid  # Calendar-focused layout

Alternate templates appear in the CMS for editors to select per season.

On this page