Staff profile

The staff profile pattern includes a role, title and name, short biography, contact details, optional photo and optional call to action.

The biography should be no more than 140 characters.
Image should be 200 × 200 pixels square.
If using a call-to-action, an image must be present as well.
When the call-to-action is present, then the heading links to the call to action URL too.
"Email", "Phone" and "Fax" should always be present if available for the person. However, additional fields may be used: "Website", "Twitter"

Default profile

The call-to-action link is also included in the profile heading.

The Principal and Vice-Chancellor

Professor Sally Mapstone

Professor Sally Mapstone is the Principal and Vice-Chancellor. The Principal and Vice-Chancellor is the Chief Executive Officer (CEO) of the University of St Andrews. Since the mid 1800s it has been customary that one person holds two titles: the post of Principal representing the executive function and the post of Vice-Chancellor the ceremonial function.‌

Contact

Email:: example@st-andrews.ac.uk
Phone:: +44 (0)1334 46 2544
Fax:: +44 (0)1334 46 xxxx

Full biography

Code

<!-- Begin pattern: staff-profile //-->

<div class="staff-profile">
        <h3><a href="http://www.st-andrews.ac.uk">The Principal and Vice-Chancellor</a></h3>
    <div class="row">
        <div class="col-sm-7 staff-details">
            <h4>Professor Sally Mapstone</h4>
            <p>Professor Sally Mapstone is the Principal and Vice-Chancellor. The Principal and Vice-Chancellor is the Chief Executive Officer (CEO) of the University of St&nbsp;Andrews. Since the mid 1800s it has been customary that one person holds two titles: the post of Principal representing the executive function and the post of Vice-Chancellor the ceremonial function.‌</p>
            <h4>Contact</h4>
            <dl>
                    <dt>Email: </dt><dd><a href="mailto:example@st-andrews.ac.uk">example@st-andrews.ac.uk</a></dd>
                    <dt>Phone: </dt><dd>+44 (0)1334 46 2544</dd>
                    <dt>Fax: </dt><dd>+44 (0)1334 46 xxxx</dd>
            </dl>
            <div class="clearfix"></div>
        </div>
        <div class="col-sm-5 text-center">
                <img src="../../assets/docs/images/placeholders/staff-profile.jpg" alt="Professor Sally Mapstone">
                <p><a href="http://www.st-andrews.ac.uk" class="btn btn-primary btn-lg">Full biography</a></p>
        </div>
    </div>
    <hr>
</div>

<!-- End pattern: staff-profile //-->

Profile without call-to-action

Without a call-to-action, there is also no link on the heading.

The Principal and Vice-Chancellor

Professor Sally Mapstone

Contact

Email:: example@st-andrews.ac.uk
Phone:: +44 (0)1334 46 2544
Fax:: +44 (0)1334 46 xxxx

Code

<!-- Begin pattern: staff-profile //-->

<div class="staff-profile">
        <h3>The Principal and Vice-Chancellor</h3>
    <div class="row">
        <div class="col-sm-7 staff-details">
            <h4>Professor Sally Mapstone</h4>
            <p>Professor Sally Mapstone is the Principal and Vice-Chancellor. The Principal and Vice-Chancellor is the Chief Executive Officer (CEO) of the University of St&nbsp;Andrews. Since the mid 1800s it has been customary that one person holds two titles: the post of Principal representing the executive function and the post of Vice-Chancellor the ceremonial function.‌</p>
            <h4>Contact</h4>
            <dl>
                    <dt>Email: </dt><dd><a href="mailto:example@st-andrews.ac.uk">example@st-andrews.ac.uk</a></dd>
                    <dt>Phone: </dt><dd>+44 (0)1334 46 2544</dd>
                    <dt>Fax: </dt><dd>+44 (0)1334 46 xxxx</dd>
            </dl>
            <div class="clearfix"></div>
        </div>
        <div class="col-sm-5 text-center">
                <img src="../../assets/docs/images/placeholders/staff-profile.jpg" alt="Professor Sally Mapstone">
        </div>
    </div>
    <hr>
</div>

<!-- End pattern: staff-profile //-->

Profile without photo and link to biography

The Principal and Vice-Chancellor

Professor Sally Mapstone

Contact

Email:: example@st-andrews.ac.uk
Phone:: +44 (0)1334 46 2544
Fax:: +44 (0)1334 46 xxxx

Code

<!-- Begin pattern: staff-profile //-->

<div class="staff-profile">
        <h3>The Principal and Vice-Chancellor</h3>
    <div class="row">
        <div class="col-sm-7 staff-details">
            <h4>Professor Sally Mapstone</h4>
            <p>Professor Sally Mapstone is the Principal and Vice-Chancellor. The Principal and Vice-Chancellor is the Chief Executive Officer (CEO) of the University of St&nbsp;Andrews. Since the mid 1800s it has been customary that one person holds two titles: the post of Principal representing the executive function and the post of Vice-Chancellor the ceremonial function.‌</p>
            <h4>Contact</h4>
            <dl>
                    <dt>Email: </dt><dd><a href="mailto:example@st-andrews.ac.uk">example@st-andrews.ac.uk</a></dd>
                    <dt>Phone: </dt><dd>+44 (0)1334 46 2544</dd>
                    <dt>Fax: </dt><dd>+44 (0)1334 46 xxxx</dd>
            </dl>
            <div class="clearfix"></div>
        </div>
        <div class="col-sm-5 text-center">
        </div>
    </div>
    <hr>
</div>

<!-- End pattern: staff-profile //-->