{%- capture image_id -%}{%- if include.id %} id="{{ include.id }}"{%- endif -%}{%- endcapture -%}
{%- capture image_width -%}{%- if include.width and include.width != "" %} width="{{ include.width }}"{%- endif -%}{%- endcapture -%}
{%- capture image_height -%}{%- if include.height and include.height != "" %} height="{{ include.height }}"{%- endif -%}{%- endcapture -%}
{%- capture image_style -%}{%- if include.maxwidth %} style="max-width:{{ include.maxwidth }}"{%- elsif include.width %} style="width:{{ include.width }}px"{%- endif -%}{%- endcapture %}
  <div class="pcjs-gallery-frame"{{ image_id }}{{ image_style }}>
{%- capture image_src -%}{{ site.baseurl }}{{ include.image | default: include.src }}{%- endcapture -%}
{%- if image_src %}
    <div class="pcjs-gallery-image">
  {%- if include.link -%}
    {%- capture image_link %}href="{{ site.baseurl }}{{ include.link }}"{%- if include.external %} target="_blank"{%- endif -%}{%- endcapture %}
      <a {{ image_link }}><img src="{{ image_src }}"{{ image_width }}{{ image_height }} alt="{{ include.title }}" title="{{ include.note }}"></a>
  {%- else %}
      <img src="{{ image_src }}"{{ image_width }}{{ image_height }} alt="{{ include.title }}" title="{{ include.note }}">
  {%- endif %}
    </div>
  {%- unless include.file contains '/' %}
    <span class="pcjs-gallery-label">{{ include.title | replace: "(","<br>(" }}</span>
  {%- else %}
    <a href="{{ include.file }}" target="_blank"><span class="pcjs-gallery-label">{{ include.title | replace: "(","<br>(" }}</span></a>
  {%- endunless %}
  {%- if include.source contains "http" %}
    <br><span class="pcjs-gallery-label">[<a href="{{ include.source }}" target="_blank">Source</a>]</span>
  {%- endif -%}
{%- else %}
    <span class="pcjs-gallery-label"><a href="{{ site.baseurl }}{{ include.link }}">{{ include.title }}</a></span>
{%- endif %}
  </div>