Skip to content
This repository has been archived by the owner on Sep 19, 2024. It is now read-only.

Alert Banner

adam breznicky edited this page Sep 10, 2019 · 1 revision

For enabling/disabling and editing the content of the alert banner at the top of the site

To utilize the dismissible alert banner at the top of the website, 2 files will need to be edited:

  1. ./templates/base.html
  2. ./static/site.js

BASE.HTML

Approximately lines 45-52, is the 'div' alert holder which will be injected with the alert message/content. This div is shown as reads: <div class="alert-holder" id="alert-holder">......</div>

  • Un-comment this div section and save the file
  • do not alter the 'class' or 'id' of the div itself
  • do not edit the content of the div in this file, it will be injected via javascript

SITE.JS

At the bottom of the file (approximately lines 159-171) is the Javascript function which runs on page load to display the alert banner. It displays only if the user has not deliberately hidden the banner previously. Edit the HTML injected by this function to alter the banner contents:

  • edit the contents html with line (approximately) 162 $('#alert-contents').html(...); by replacing the '...' with the HTML contents as a string
  • the HTML should be a single line of code (no returns) surrounded by single quotes
  • an example of the contents HTML to be used in line 162:
    <strong>NOTICE</strong>
    <br>The GIO Meeting scheduled for Tuesday, January 16 has been postponed until further notice due to inclement weather conditions.
    <br>
  • better yet, as a single line as it will exactly be in context:
$('#alert-contents').html('<strong>NOTICE</strong><br>The GIO Meeting scheduled for Tuesday, January 16 has been postponed until further notice due to inclement weather conditions.<br>');
  • the dismiss button will already exist from the 'base.html'

<-- Back to Main Page