---
layout: default
---

<article
  class="blog-post h-entry"
  itemscope
  itemtype="http://schema.org/BlogPosting"
>
  <header class="blog-post__header">
    <div class="blog-post__header__category"><span><a href="{{ page.category | relative_url}}">#️⃣ {{ page.category }}</a></span></div>
    <div>
      <h3 class="blog-post__header__title" itemprop="name headline">
        {{ page.title | escape }}
      </h3>
    </div>
    <div class="blog-post__header__description">
      <span>{{page.description}}</span>
    </div>
    <div class="blog-post__header__meta">
      <span>
        <time
          datetime="{{ page.date | date: "%-d %B %Y" }}"
          itemprop="datePublished"
        >
          {% if page.author %} By
          <span itemprop="author" itemscope itemtype="http://schema.org/Person">
            <span class="blog-post__header__meta__author h-card" itemprop="name"
              ><a href="{{ 'about' | relative_url }}"
                >{{ page.author }}</a
              ></span
            ></span
          >
          • {% endif %} 🗓️ {% assign date_format = site.minima.date_format |
          default: "%b %-d, %Y" %} {{ page.date | date: date_format }}
        <time>
      </span>
    </div>

    {% if page.image %}
    <img
      class="blog-post__header__image"
      alt="{{ page.description | escape }} | Developer Blog How To"
      title="{{page.description | escape}}"
      src="../assets/images/{{page.image}}.jpg"
    />
    {% if page.image-attrib %} {% if page.image-attrib-url %}
    <p class="blog-post__header__image-caption">
      <a href="{{ page.image-attrib-url }}" targe="_blank"
        >Photo &copy; {{ page.image-attrib }}</a
      >
    </p>
    {% else %}
    <p class="blog-post__header__image-caption">
      Image &copy; {{ page.image-attrib }}
    </p>
    {% endif %} {% endif %} {% endif %}
  </header>

  <div class="blog-post__content e-content" itemprop="articleBody">
    {{ content }}
  </div>

  <div class="blog-post__after-content">
    <div id="reply-by-email">
      <a href="mailto:blog@ayco.io?subject=Re: {{page.title}}&body=%0A%0AResponse to: {{site.url}}{{page.url}}">Thoughts? Reply to this post by email</a>
      <style>
        #reply-by-email {
          margin: 1em 0;
        }
        #reply-by-email a:hover {
          color: #ee4a03;
          border: 1px solid #ee4a03;
        }
        #reply-by-email a {
          color: #bb4a03;
          background-color: #f5f5f5;
          border: 1px solid #ccc;
          border-radius: 5px;
          padding: 0.5em;
          width: calc(100% - 1em);
          text-align: center;
          display: inline-block;
          font-size: 24px;
          font-weight: bold;
          font-family: medium-content-sans-serif-font, -apple-system,
            BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
            "Open Sans", "Helvetica Neue", sans-serif !important;
        }
      </style>
    </div>
    <div id="rss-sign-up">
      <span>For more <em>{{ page.category }}</em> posts like this, subscribe to my <a href={{'feed.xml' | relative_url}}>RSS feed</a></span>
    </div>
  </div>

  <a class="u-url" href="{{ page.url | relative_url }}" hidden></a>
</article>