CSS Codes

Most Recent Agenda Button: Add clarifying text to homepage

Careful, this is a requirement for CA websites! Don't change the wording too much.

Additional Codes

Banner Zone

Put the following style into the styles section to remove the gradient on page banners

Board Meeting Codes

Carousel Codes

Catalog Search Bar

This one is dependent on how the search form is structured. Scripts should be placed in the body section of advanced, and style should be placed in…

Color Contrast Issues

Disable clickability of teasers on a page:

Embedded Engage

The embed will only show up when signed out but will update dynamically with public lists. Remember to edit the homepage after changing a list to…

Fix dropdown and hover nav color contrast

Footer Codes

Force ALL related content teaser images to the same size, site-wide or on one page, cleanly

.poc-instances-side-content .poc-instance.has-image .inner .image {
height: 180px;
overflow: hidden;
display: flex;
align-items: center…

Force extra teaser columns (more than 3) and center teaser titles on a page

Kurt cooked

Header

Hide Title of a Page

Add a jquery snippet to hide the title so it still exists in the HTML for search engines, but won't be displayed in the browser.

Homepage CSS

Homepage teaser width

Put this in the styles tab, and edit the percentages to how you would like it to display. Any teasers after the specified ones will default to normal…

Homescreen Teaser Disabler

Library Catalog Search Bar stuff

Horizontal Tables for Moblie View

Copy and paste this code into CSS

Horizontal and vertical gradient at the same time!

Chat gpt prompt:

Cartoon dog wearing a cap, riding a motorcycle. #CutePupOnBike

Less terrible image gallery

Put this in the styles tab:

Main Body Content

Making color changes to the navigation bar and hover

// Updating the Nagivation Bar Colors #A13217
.navbar-nav > li.sl-menu--open > a{
background: #222;
}

Meetings

Mobile View Adjustments (South Davis Edition)

// Mobile adjustments
@media (max-width: 480px) {
p.social-header-streamline {
margin-top: 15px;
text-align: center;
}
#…

Navigation Codes

Overlay all teaser images

.poc-instance.has-image .image {
position: relative; /* Ensure that the container for the image is relative to position the overlay properly…

Overlay on all banner zones code

Add to CSS:

Product 'Buy Now' button auto open

Place this code in the script section of the advanced theme editor. It will make it so that all products have the checkout form open automatically so…

Quicklinks

RSS Feed

Related Teasers

Scrolling Navigation Bar

NOTE: You must be signed out in order for it to show/ work.

Scrolling emergency notification bar

Social Media

Sticky Header for Mobile

This will stick the header/nav to the top of the screen as mobile users scroll up and down the page

Wide Body Kit

Put this as a HTML embed on the page. There is now a version for all page layouts!

carousel mobile view adjustments

// mobile adjustments
@media (max-width: 500px) {
p.social-header-streamline {
margin-top: 15px;
text-align: center;
}
.homepage-carousel…