Page Elements: Helpers
Helpers are preconfigured layout designs for Emory Libraries website pages
Helpers
Helpers take a number of different components and pull them together to make it easier for content editors and authors to create a page layout. Below are a variety of different types of helpers content editors can use when creating a page on the site. These are available by adding helpers to the layout canvas.
The job posting helper gives you a template to easily fill in when posting a job.
Components used:
- Container: contains the components within a set width and height
- Divider line: between the page title and the position summary. The color is set to grey 20
- 2 column layout: set to left 8(2/3) / right 4(1/3)
- Text box: position summary (typical text formats are “normal” and “heading 2” for section headers)
- Explorer: links to PDF and organization chart page
- Content Card: “Apply now” with link to Emory Careers or Interfolio job posting link
Job posting template fields
Job posting example
The basic page with explorer can be used whenever you want to give information and some helpful links to further aspects or details.
Components used:
- 2 column layout: set to left 8(2/3) / right 4(1/3)
- Text box: lead paragraph with “paragraph lead” size and styling
- Text box: typical text formats are “normal” for paragraph text and “heading 2” for section headers
- Explorer: links to PDFs, internal pages and/or external sites
Basic page with explorer template fields
Basic page with explorer example
Use the info card landing page as a hub for multiple links with information.
Components used:
- Container: contains the components within a set width and height
- Text box: lead paragraph with “paragraph lead” size and styling
- 3 column layout: three equally-sized columns set at 4 1/3
- Info Card: card with icon, heading, subheading, description, call to action, and link fields
Info card landing page template fields
Info card landing page example
Use a content card landing page as basically a hub or table of contents with thumbnails and links for other content pages.
Components used:
- Container: contains the components within a set width and height
- Text box: lead paragraph with “paragraph lead” size and styling
- 3 column layout: three equally-sized columns set at 4 1/3
- Content card: card with image (recommended file type png or jpg; width 568px x 352px or bigger), image alt tag, heading, subheading, badge, description, call to action, and link to page or URL
Content Card Template Fields
Content Card Landing Page example
Use the basic page with sidebar links when you want to supplement the content with additional links to other pages.
Components used:
- 2 column layout: set to left 8(2/3) / right 4(1/3)
- Text box: lead paragraph with “paragraph lead” size and styling
- Text box: typical text formats are “normal” for paragraph text and “heading 2” for section headers
- Sidebar links: heading, heading icon, link labels and links to pages or URLs. Multiple links can be added
- Divider line (between sidebar links components): Color commonly set to grey 20
Basic page with sidebar links fields.
Basic page with sidebar links example
Use the basic page with image content when you have an engaging image to showcase with your content.
Components used:
- Text box: lead paragraph with “paragraph lead” size and styling
- 2 column layout: set to left 8(2/3) / right 4(1/3)
- Image: the larger the image uploaded the better, since it will stretch across the page.
- Most common settings in image component: Image size “Large (W1360)” typically used; layout and style/height/behavior: natural size of image
- Text box: typical text formats are “normal” for paragraph text and “heading 2” for section headers
- Explorer: links to PDFs, internal pages and/or external sites
Basic page with image template fields
Basic page with image example
Use a basic page with no sidebar when you just want to get the information out there with as minimal frills as possible.
Components used:
- Container: contains the components within a set width and height
- Text box: lead paragraph with “paragraph lead” size and styling
- Text box: typical text formats are “normal” for paragraph text and “heading 2” for section headers
Basic page with no sidebar template fields
Basic page with no sidebar example
