Alert Banners

Option 1 - Yellow  Alert Banner

The easiest way to add a yellow text banner is with the following HTML code:

<div id='msg' class='info postIt'><span>Your message here</span></div>

Note: You can omit the keyword 'info' to prevent the blue i from appearing at the left hand side

This code can be added to an 'NUIG Code Only' content type to have the yellow banner appear in the page body (to the right of the leftbar).
Or you can add it to the page's DC.Description (if it's empty) to make a full-width yellow banner appear just below the page title.

The first method is useful if you wish to have the same message appear on multiple pages. Simply add the message to your first page and mirror it to all other pages.  Then, if you change one, all others will change too.

Option 2 - Maroon Information Banner

Another piece of code that can be inserted into an 'NUIG Code Only' content type is as follows:

<div class="pageButtons" style="width: 100%;">
<div class="pageButtonsWrapper">
<ul style="display: block !important;">
<li><a href="#" class="info"><span>Your text goes here</span></a></li>
</ul>
</div>
</div>
<style>
@media only screen and (max-width: 999px) {
div.pageButtons li { display: block !important; }
}
</style>

This method has the added advantage that, on small-screen devices (e.g. mobile phones), it will stick to the bottom of the screen and remain visible, even if the user scrolls down or up. 
To test this feature out, simply make your browser window narrow.

You can also turn it into a link by changing the # into a web address (e.g. //www.nuigalway.ie/research/news/).
Also the button's icon can be a tick, magnifying-glass-on-a-page, or an information symbol.  Just set the class to howToApply, findCourse, or researchInfo.