Author

Tagging authors provides easy access to their online profile and publications.

Default appearance

Aaron Berg
Aaron Berg
Adam Cunningham
Adam Cunning
Andrew Geraghty
Andrew Geraghty
Danial Hewetson
Danial Hewetson
Roman Rus
Roman Rus
<div class="bocss-author">
    <div class="bocss-author__bio">
        <a aria-label="Aaron Berg" title="Aaron Berg" href="#" class="bocss-author__icon bocss-author__blue">
            <img src="https://design.bankofcanada.ca/wp-content/uploads/2019/04/AaronBerg.jpg" alt="Aaron Berg" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__blue"><span class="bocss-author__name">Aaron Berg</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Adam Cunning" title="Adam Cunning" href="#" class="bocss-author__icon bocss-author__blue">
            <img src="https://design.bankofcanada.ca/docroot/wp-content/uploads/2019/04/AdamCunning.jpg" alt="Adam Cunning" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__blue"><span class="bocss-author__name">Adam Cunning</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Danial Hewetson" title="Danial Hewetson" href="#" class="bocss-author__icon bocss-author__blue">
            <img src="https://design.bankofcanada.ca/docroot/wp-content/uploads/2019/04/DanialHewetson.jpg" alt="Danial Hewetson" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__blue"><span class="bocss-author__name">Danial Hewetson</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Roman Rus" title="Roman Rus" href="#" class="bocss-author__icon bocss-author__blue">
            <img src="https://design.bankofcanada.ca/wp-content/uploads/2019/04/RomanRus.jpg" alt="Roman Rus" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__blue"><span class="bocss-author__name">Roman Rus</span></div>
    </div>
</div>

Shortcode

[Author]

Yellow

Aaron Berg
Aaron Berg
Adam Cunningham
Adam Cunning
Andrew Geraghty
Andrew Geraghty
Danial Hewetson
Danial Hewetson
Roman Rus
Roman Rus
<div class="bocss-author">
    <div class="bocss-author__bio">
        <a aria-label="Aaron Berg" title="Aaron Berg" href="#" class="bocss-author__icon bocss-author__yellow">
            <img src="https://design.bankofcanada.ca/wp-content/uploads/2019/04/AaronBerg.jpg" alt="Aaron Berg" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__yellow"><span class="bocss-author__name">Aaron Berg</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Adam Cunning" title="Adam Cunning" href="#" class="bocss-author__icon bocss-author__yellow">
            <img src="https://design.bankofcanada.ca/docroot/wp-content/uploads/2019/04/AdamCunning.jpg" alt="Adam Cunning" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__yellow"><span class="bocss-author__name">Adam Cunning</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Danial Hewetson" title="Danial Hewetson" href="#" class="bocss-author__icon bocss-author__yellow">
            <img src="https://design.bankofcanada.ca/docroot/wp-content/uploads/2019/04/DanialHewetson.jpg" alt="Danial Hewetson" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__yellow"><span class="bocss-author__name">Danial Hewetson</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Roman Rus" title="Roman Rus" href="#" class="bocss-author__icon bocss-author__yellow">
            <img src="https://design.bankofcanada.ca/wp-content/uploads/2019/04/RomanRus.jpg" alt="Roman Rus" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__yellow"><span class="bocss-author__name">Roman Rus</span></div>
    </div>
</div>

Shortcode

[Author colour="yellow"]

Green

Aaron Berg
Aaron Berg
Adam Cunningham
Adam Cunning
Andrew Geraghty
Andrew Geraghty
Danial Hewetson
Danial Hewetson
Roman Rus
Roman Rus
<div class="bocss-author">
    <div class="bocss-author__bio">
        <a aria-label="Aaron Berg" title="Aaron Berg" href="#" class="bocss-author__icon bocss-author__green">
            <img src="https://design.bankofcanada.ca/wp-content/uploads/2019/04/AaronBerg.jpg" alt="Aaron Berg" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__green"><span class="bocss-author__name">Aaron Berg</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Adam Cunning" title="Adam Cunning" href="#" class="bocss-author__icon bocss-author__green">
            <img src="https://design.bankofcanada.ca/docroot/wp-content/uploads/2019/04/AdamCunning.jpg" alt="Adam Cunning" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__green"><span class="bocss-author__name">Adam Cunning</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Danial Hewetson" title="Danial Hewetson" href="#" class="bocss-author__icon bocss-author__green">
            <img src="https://design.bankofcanada.ca/docroot/wp-content/uploads/2019/04/DanialHewetson.jpg" alt="Danial Hewetson" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__green"><span class="bocss-author__name">Danial Hewetson</span></div>
    </div>
    <div class="bocss-author__bio">
        <a aria-label="Roman Rus" title="Roman Rus" href="#" class="bocss-author__icon bocss-author__green">
            <img src="https://design.bankofcanada.ca/wp-content/uploads/2019/04/RomanRus.jpg" alt="Roman Rus" class="bocss-author__image">
        </a>
        <div class="bocss-author__tooltip bocss-author__green"><span class="bocss-author__name">Roman Rus</span></div>
    </div>
</div>

Shortcode

[Author colour="green"]

Parameters

Parameter Values Description
post_id user-specified integer ID of the post that contains the author tags to be displayed. If no post or author ID is specified, the current post will be used.
author_id user-specified string A list of all author IDs separated by commas. If no post or author ID is specified, the current post will be used.
colour blue, green, yellow Colour for the photo outline and name label. "Blue" is the default colour.