membership_tiers

{% for tier in membership_tiers %}
  <div class="tier-card">
    <h3>{{ tier.name }}</h3>
    {% if tier.type == 'Paid' %}
      <p>{{ tier.monthly_price | money }} per month</p>
    {% else %}
      <p>Free</p>
    {% endif %}
  </div>
{% endfor %}

{% if tier.compare_at_monthly_price %}
  <s>{{ tier.monthly_price | money }}</s>
  {{ tier.compare_at_monthly_price | money }} first month
{% else %}
  {{ tier.monthly_price | money }} per month
{% endif %}

<!-- Twitch subscriber discount -->
{{ tier.monthly_variant.discounts.twitch.after_discount_price | money }}

<!-- Introductory discount -->
{{ tier.monthly_variant.discounts.introductory.after_discount_price | money }}

{% for tier in membership_tiers %}
  <div class="tier-card">
    {% if tier.type == 'Free' %}
      {% if tier.image_url %}
        <img src="{{ tier.image_url | img_url: 'medium' }}" alt="{{ tier.name }}">
      {% endif %}

      <h3>{{ tier.name }}</h3>

      {% if tier.members_count %}
        <p>{{ tier.members_count }} member{% if tier.members_count != 1 %}s{% endif %}</p>
      {% endif %}

      <p>Free</p>

      <a href="{{ tier.registration_url }}">Join now</a>

      {% if tier.perks.size > 0 %}
        <ul>
          {% for perk in tier.perks %}
            <li>{{ perk }}</li>
          {% endfor %}
        </ul>
      {% endif %}

    {% elsif tier.type == 'Paid' %}
      {% if tier.image %}
        <img src="{{ tier.image | img_url: 'medium' }}" alt="{{ tier.name }}">
      {% endif %}

      <h3>{{ tier.name }}</h3>

      <p>
        {% if tier.compare_at_monthly_price %}
          <s>{{ tier.monthly_price | money }}</s>
          {{ tier.compare_at_monthly_price | money }} first month
        {% else %}
          {{ tier.monthly_price | money }} per month
        {% endif %}
      </p>

      <a href="{{ tier.url }}">
        {% if tier.trial_enabled %}
          Start 7-day free trial
        {% else %}
          Join now
        {% endif %}
      </a>

      {% if tier.annual_price %}
        <p>
          <a href="{{ tier.annual_url }}">
            Save {{ tier.annual_discount_percentage }}% if you pay annually
          </a>
        </p>
      {% endif %}

      {% if tier.features.size > 0 %}
        <ul>
          {% for feature in tier.features %}
            <li>{{ feature }}</li>
          {% endfor %}
        </ul>
      {% endif %}
    {% endif %}
  </div>
{% endfor %}