website/_src/_includes/board.html

<div class="board grid grid--full grid-small--half grid--gutters">

    {% assign board = site.data.board  %}

    {% for member in board %}

        {% assign slug = (member.name | downcase | replace: ' ', '-')  %}

        <div class="grid__col">
            <div class="boardmember">
                <div class="boardmember__info">
                    <img class="boardmember__avatar" src="/assets/img/board/{{ slug }}.jpg">

                    <div class="boardmember__meta">
                        <h1 class="boardmember__name">
                            {% if member.prefix %}{{ member.prefix }} {% endif %}
                            {{ member.name }}
                        </h1>
                        <p class="boardmember__position">{{ member.position }}</p>

                        {% if member.social %}
                        <p class="boardmember__social">
                            {% for item in member.social %}
                                <a href="{{ item.link }}">{{ item.name }}</a>
                            {% endfor %}
                        </p>
                        {% endif %}
                    </div>
                </div>

                <div class="boardmember__bio">{{ member.bio | markdownify }}</div>
            </div>
        </div>

    {% endfor %}
</div>