TRU Supporting Wildfire Evacuees » More info
Thompson Rivers University
Thompson Rivers University

Basic Content

Templates with a right sidebar support Widgets. These content areas are displayed with a different background colour and support full-width images.

Tips:

  • For all widget content areas use a div with class 'widget'
  • To indent lists correctly, give them a class of 'block'

Text Widget

<div class="widget">
<h4 class="altHead">Text Widget</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vestibulum feugiat egestas. Pellentesque eget neque eleifend, consectetur felis nec, condimentum massa. Praesent metus ipsum, fermentum quis dignissim nec, ultricies facilisis sem.</p>
</div>

Image with caption

When you insert an image, it will automatically be full-width; this is also the case with image captions. To provide padding in the caption box, use the class 'caption'.

<img class="full" src="https://placeimg.com/400/400/animals" alt="menu-1 image">
<div class="caption tealbg small-12">
<h4>This is the image caption.</h4>
</div>

List Widget

<div class="widget">
<h4 class="altHead">List Widget</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vestibulum feugiat egestas. Pellentesque eget neque eleifend, consectetur felis nec, condimentum massa.</p>
<ul class="dotted">
<li><a href="#">Fermentum quis dignissim </a></li>
<li><a href="#">Suspendisse risus enim</a></li>
<li><a href="#">Sed lobortis</a></li>
<li><a href="#">Suscipit at massa</a></li>
</ul>
</div>

Promo Box

<img class="full" src="https://placeimg.com/400/400/animals" alt="menu-1 image">
<div class="caption tealbg small-12">
<h4>This is a promo box</h4>
<p>Praesent metus ipsum, fermentum quis dignissim nec, ultricies facilisis sem.</p>
<p><a href="#">Read more about this</a></p>
</div>