Season Template

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

Property	Type	Description
id	string	Unique identifier
title	string	Season name (e.g., “2024-25 Season”)
description	string	Season description
slug	string	URL-safe identifier
image	media	Main season image

Date Properties

Property	Type	Description
startDate	string	Season start date (ISO 8601)
endDate	string	Season end date (ISO 8601)

Relationships

Property	Type	Description
events	array	Events in this season

Content

Property	Type	Description
blocks	array	Content blocks
customAttributes	object	Custom attribute values
theme	object	Theme-specific field values

Metadata

Property	Type	Description
meta.title	string	SEO title
meta.description	string	SEO description
meta.image	media	SEO/OG image
createdAt	string	Creation timestamp
updatedAt	string	Last 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.