AKA – Column Rotator
Requirements
This component will be manually managed by an admin user in the CMS.
Admins will be able to select the background color. NOTE: Colors TBD.There will be a minimum of three items in the component, with no maximum. Component will always center the columns
Admins will manually pages to feature in the component. Component will reference and display the following fields per item:
Eyebrow: (optional)
Page Title
Image (optional)
teaser text (optional)
Number of comments on page (number refreshed on page load)Description (optional)
When more than four items are included in the component, the rotator function will be triggered. Users will be able to scroll through the items using the arrows provided.
Component can be set to autoplay, so that items rotate in from the right every ten seconds.Each item in the component will feature a hover state to indicate clickable content.
Hovering over an item will cause the rotator autoplay function to pause until the mouse is no longer hovering over an item.Clicking on any item or link in the component will take a user to the page specified by an admin in the CMS.Events will have a unique component Column Rotator - Events
Pending decision on Disqus Commenting module for Publications section items.If an item that has comments is pulled into the component, the number of comments will display. ASCE Webteam to confirm.
CMS Fields
Field Label | Field Type | Required? | Notes |
|---|---|---|---|
Eyebrow | single-line text | no | for entire component |
Title | single-line text | yes | for entire component |
Top Link | general link | no | includes link text and URL |
Add Column | treelist | yes | minimum of three; including five or more triggers rotator |
Show Eyebrow | checkbox | no | allows admins to specify eyebrow text per item |
Eyebrow | single line text | no | |
Show Images | checkbox | no | unchecked by default; when checked, page featured images will be pulled in for each column (Dimensions: 425 x 300) |
Show Description | checkbox | no | default is not checked; when checked, each column will reference and display the teaser text |
Bottom Link | General Link | no |
https://styleguide.asce.org/section-components.html#asgref-components-columns-slider