<article id="comment{{ include.index }}" class="js-comment comment" itemprop="comment" itemscope itemtype="https://schema.org/Comment">
  <div class="comment__avatar-wrapper">
    <img class="comment__avatar" src="https://www.gravatar.com/avatar/{{ include.email }}?d=mm&s=80" alt="{{ include.name }}">
  </div>
  <div class="comment__content-wrapper">
    <h3 class="comment__author" itemprop="author" itemscope itemtype="https://schema.org/Person">
      {% unless include.url == blank %}
        <span itemprop="name"><a rel="external nofollow" itemprop="url" href="{{ include.url }}">{{ include.name }}</a></span>
      {% else %}
        <span itemprop="name">{{ include.name }}</span>
      {% endunless %}
    </h3>
    <p class="comment__date">
      {% if include.date %}
        {% if include.index %}<a href="#comment{{ include.index }}" itemprop="url">{% endif %}
        <time datetime="{{ include.date | date_to_xmlschema }}" itemprop="datePublished">{{ include.date | date: "%B %-d, %Y at %I:%M %p" }}</time>
        {% if include.index %}</a>{% endif %}
      {% endif %}
    </p>
    <div itemprop="text">{{ include.message | markdownify }}</div>
  </div>
</article>
