Skip to content

The Model template

The Model template is used to showcase the model / talent galleries, often with listings of measurements / attributes, key skills, links to social profiles, a resume, and gallery PDFs.

The galleries available to the Model template will depend on gallery-division assignments, the order of galleries, and whether a specific gallery is referenced via the URL. The gallery object will be the current explicit gallery from the URL (e.g. ...portfolios/[model-slug]/[gallery-slug]), or the first available gallery in the division context. Other galleries can be accessed via model.galleries.

Skeleton example

liquid
{% comment %} Set which measurement types to display {% endcomment %}
{% assign defaultMeasurements = 'Height,Dress,Bust,Chest,Waist,Hip,Shoe' | split: ',' %}
{% assign femaleMeasurements = 'Height,Dress,Bust,Waist,Hip,Shoe' | split: ',' %}
{% assign maleMeasurements = 'Height,Chest,Waist,Hip,Inseam,Shoe' | split: ',' %}
{% assign nonBinaryMeasurements = 'Height,Dress,Chest,Waist,Hip,Inseam,Shoe' | split: ',' %}
{% assign youthMeasurements = "Kids' Height,Kids' Clothing,Shoe" | split: ',' %}
{% comment %} Youth measurements used under this age {% endcomment %}
{% assign youthAge = 16 %}

{% assign includeMeasurements = defaultMeasurements %}
{% if model.gender == 'female' %}
  {% assign includeMeasurements = femaleMeasurements %}
{% elsif model.gender == 'male' %}
  {% assign includeMeasurements = maleMeasurements %}
{% elsif model.gender == 'non-binary' %}
  {% assign includeMeasurements = nonBinaryMeasurements %}
{% endif %}
{% elsif model.age <= youthAge %}
  {% assign includeMeasurements = youthMeasurements %}
{% endif %}


<header class="model-header">
  <h1 class="model-name">{{ model.display_name }}</h1>
  {% if division %}
    <p>{{ division.name }}</p>
  {% endif %}
</header>

<nav class="model-nav">
  {% for _gallery in model.galleries %}
    <a href="{{ model.url | within: division }}{{ _gallery.url }}{% if package %}?package_token={{ package.token }}{% endif %}">
      {{ _gallery.name }}
    </a>
  {% endfor %}
  {% if model.resume_url %}
    <a href="{{ model.resume_url }}" target="_blank" rel="nofollow" title="Open / download resume">
      Resume
    </a>
  {% endif %}
  <a href="mailto:?subject={{ model.display_name }} | {{ agency.name }}&body={{ model.display_name }} ({{ agency.url }}{{ model.url | within: division }})">
    Share
  </a>
  {% if gallery.media_type == 'image' %}
    <a href="https://pdf.syngency.com/{{ gallery.id }}?size=custom&orientation=landscape" target="_blank" rel="nofollow" title="PDF with large images">
      Print
    </a>
  {% endif %}
  {% if package %}
    <a href="/packages/{{ package.token }}">
      Back to Package
    </a>
    <a href="https://download.syngency.com/gallery/{{ gallery.id }}" rel="nofollow">
      Download Gallery
    </a>
  {% endif %}
  {% if model.social.instagram %}
    <a href="{{ model.social.instagram.url }}" rel="nofollow noopener" target="_blank" title="View {{ model.display_name }} on Instagram">
      Instagram {{ model.social.instagram.followers_rounded }}
    </a>
  {% endif %}
  {% if model.social.tiktok %}
    <li>
      <a href="{{ model.social.tiktok.url }}" rel="nofollow noopener" target="_blank" title="View {{ model.display_name }} on TikTok">
        TikTok {{ model.social.tiktok.followers_rounded }}
      </a>
    </li>
  {% endif %}
</nav>

<section class="model-gallery">
  {% if gallery.media_type == 'image' %}
      
    {% for image in gallery.files %}
      <a href="{{ image.large_url }}">
        <img src="{{ image.medium_url }}" alt="{{ model.display_name }} | {{ gallery.name }}" width="{{ image.width }}" height="{{ image.height }}">
      </a>
    {% endfor %}

  {% elsif gallery.media_type == 'video' %}

    {% for video in gallery.files %}

      {% comment %}
      Set up video URL with parameters for optimal embedding
      {% endcomment %}
      {% assign videoUrl = video.url %}
      {% assign videoParam = '?' %}
      {% if video.external_source == 'youtube' or video.external_source == 'vimeo' %}
        {% if videoUrl contains '?' %}
          {% assign videoParam = '&' %}
        {% endif %}

        {% if video.external_source == 'youtube' %}
          {% assign videoParam = videoParam | append: 'iv_load_policy=3&modestbranding=1&playsinline=1&showinfo=0&rel=0&enablejsapi=1&version=3&playerapiid=ytplayer&origin=' | append: agency.url | replace: 'http://', 'https://' %}
        {% elsif video.external_source == 'vimeo' %}
          {% assign videoParam = videoParam | append: 'loop=false&byline=false&portrait=false&title=false&speed=true&transparent=0&gesture=media&color=aaa' %}
        {% endif %}
      {% endif %}

      {% assign videoUrl = videoUrl | append: videoParam %}

      <iframe src="{{ videoUrl }}"></iframe>
    {% endfor %}

  {% elsif gallery.media_type == 'audio' %}

    {% for file in gallery.files %}
      <div class="audio-item">
        {% if file.credit %}
          <p>{{ file.credit }}</p>
        {% endif %}
        <audio controls>
          <source src="{{ file.url }}" type="{{ file.type }}" />
        </audio>
      </div>
    {% endfor %}

  {% endif %}
</section>

<section class="model-appearance">
  <ul class="measurements">
    {% for im in includeMeasurements %}
      {% for m in model.measurements %}
        {% if im == m.name %}
          <li>
            <label>{{ m.name }}</label>
            <span>
              {% if m.imperial %}
                {{ m.imperial }}
              {% else %}
                {{ m.size }}
              {% endif %}
            </span>
          </li>
        {% endif %}
      {% endfor %}
    {% endfor %}
    {% if model.age <= youthAge %}
      <li>
        <label>Age</label>
        <span>{{ model.age }}</span>
      </li>
    {% endif %}
    {% if model.hair_color %}
      <li>
        <label>Hair</label>
        <span>
          {% if model.hair_color contains ' - ' %}
            {% assign hairColor = model.hair_color | split: ' - ' %}
            {{ hairColor | last }} {{ hairColor | first }}
          {% else %}
            {{ model.hair_color }}
          {% endif %}
        </span>
      </li>
    {% endif %}
    {% if model.eye_color %}
      <li>
        <label>Eyes</label>
        <span>
          {% if model.eye_color contains ' - ' %}
            {% assign eyeColor = model.eye_color | split: ' - ' %}
            {{ eyeColor | last }} {{ eyeColor | first }}
          {% else %}
            {{ model.eye_color }}
          {% endif %}
        </span>
      </li>
    {% endif %}
  </ul>
</section>

{% if model.profile %}
  <section class="model-profile">
    {{ model.profile }}
  </section>
{% endif %}