Left Menu Right Menu
March 19, 2020

Banner at the Top of Primo


Developer

University of Wisconsin

Code Repository

https://kb.wisconsin.edu/uwlss/76390

Description

Adds a banner to the top of Primo that can be used to alert patrons of disruptions to Primo or any other library related services.

Primo Banner Example from EOU














System Components

PBO and Package Manager

Skillset Requirements

PBO and CSS

Accessibility

Has not been tested for accessibility.

Browser Support

Tested on Chrome and Firefox.

Mobile Support

Tested on iPhone.

Implementation

1. From the PBO landing page, go to Deploy & Utilities -> Customization Manager.

2. Under the “Download a Package” header, click on the download button for your institution.

3. Unzip the file you downloaded, then open the custom1.css file in the css directory with a text editor (Notepad++ for example).

4. Add the following block of css to your custom1.css file:

/* Emergency Broadcast Banner*/
body::before {
content: "Add message text here";
display: inline-block;
background: #ecd90f;
text-align: center;
width: 100%;
font-weight: bold;
}

*Note, if you’d like to disable the banner when the message is no longer relevant, you can either remove this block of code or comment it out until it’s needed again, like so:

/*body::before {
content: "Add message text here";
display: inline-block;
background: #ecd90f;
text-align: center;
width: 100%;
font-weight: bold;
}*/


5. Change the content property text with whatever message you’d like to pass on to your patrons.

6. If the yellow background isn’t what you’re after, you can remove the #ecd90f value for the background property and replace it with whatever you’d like. For convenience, you can get the hex value for the color you want using the w3schools color picker.

7. Save and close the custom1.css file.

8. Zip and upload your package in the PBO: Deploy & Utilities -> Customization Manager. For more reliable results use 7-Zip to zip your institution’s package.

9. Deploy your view.


Back to Blog
Comments (0)
Reply To Article