Skip to content

AEM Support Docs

Component Glossary

Collection of AEM components
AEM Components

AEM Components

Full List of AEM Components

(C01-C10)

  • Header (C01)

    The Header is only authored by a small group of admins that run the main nature.org homepage and other TNC properties on AEM (such as the Canada site, the Australia site, and so on). The header is authored once and inherited on all other pages throughout the site. 

  • Footer (C02)

    The Footer is authored by a small group of site admins. It is authored once on a site homepage and inherited on all other pages across the site.  

  • Hero Image w/ CTA (C08)*

    *Carousel disabled, now functions as a hero with CTA

    Allowed only on Landing & Campaigns pages (T02). This component allows the author to create a hero with a CTA button. 

    There is a now a new 'Split' variation that is intended for pages with clear call to action goals. Consider using this variation for campaign landing pages. 

  • Hero Image - Large (C09)

    Hero Image - Small (C09)

    The Hero Image is the most common hero component (aka, article splash). It is allowed on:

    • T02 Landings & Campaigns
    • T03 Chapter/Program & Region Landing
    • T04 Aggregation (Automated)
    • T06 Event Detail
    • T09 Places We Protect Landing
    • T10 Places We Protect Detail
    • T11 Contact Listing & FAQs
    • T12 Contact Detail
    • T13 Aggregation (Manual)
    • T17 Forms 
    • Portal Content Page
    • Portal Homepage

    Variations includes small and large, white text or black text (author choice). 

  • Full Width Divider Photo CTA (C10)

    The Full-Width Photo CTA is available on the T01 Home Page, T02 Landing & Campaigns, T03 Chapter/Program and Region Landing, Portal Content Page and the Portal Homepage templates. 

    This component is used as an immersive call-to-action. It's intended to also function as a section divider on pages that display multi-section sets of content as seen on this Age of Nature page.

C11-C20

  • Title Text CTA (C11)

    The C11 Title Text CTA is available on most templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • T03 Chapter/Program & Region Landing
    • T04 Aggregation (Automated)
    • T06 Event Detail
    • T09 Places We Protect Landing 
    • T10 Places We Protect Landing
    • T11 Contact listing & FAQs
    • T12 Contact Detail
    • T13 Aggregation (Manual)
    • Portal Content Page
    • Portal Homepage

    The primary purpose of this component is to provide the user with a text driven call-to-action. It may also be used, in limited cases as a tagline or text-based introduction to content (when CTA is omitted).

  • In-Page Navigation - Image Tiles (C12)

    In-Page Navigation - Buttons (C12)


    The In-Page navigation component is available on:

    • T01 Home Page
    • T02 Landing & Campaigns Page
    • T03 Chapter/Program and Region Landing
    • T09 Places We Protect Landing
    • T11 Contact Listing & FAQs
    • T12 Contact Detail
    • Portal Content Page
    • Portal Homepage 

    This component is used for navigating the visitor to deeper level pages from a landing page. You can add a minimum of 3 tiles or buttons, and up to 8 items.

    When authoring this component, you will choose a parent page and the buttons or tiles will auto-generate from the child pages of that parent page. If you choose to override, there is a 20-character limit. 

  • C13 Featured Content 

    The Featured Content component is available on both landing page templates:

    • T01 Home Page
    • T02 Landing & Campaigns 
    • T03 Chapter/Program and Region Landing 
    • T05 Biography Detail 
    • Portal Content Page
    • Portal Homepage 

    The purpose of this component is to prominenly feature content such as articles and videos, or promote featured area of the site to cross-promote content.

  • C14 Search Results 

    The Search Results component is only used by site admins. It is configured once on a site on a specialized template - T16 Search Results. 

    As you expected, this component is used to provide visitors with a method of searching the site. 

  • C17 Preserve Locator

    The Preserve Locator component is configured once by site admins on the T09 Places We Protect Landing page. The component is used to facilitate preserve/pwp search. 

  • C18 Preserve Overview Detail 

    The preserve overview detail component displays a description of the preserve and high-level information at a quick glance.  This component is only available on the T10 Places We Protect Detail template. 

  • C19 Tab Container

    The C19 Tab Container component is available on the following templates:

    • T02 Landing & Campaigns
    • T04 Aggregation (Automated)
    • T05 Biography Detail
    • T06 Event Details Page
    • T10 Places We Protect Detail
    • T13 Aggregation Manual Page
    • Portal Content Page
    • Portal Homepage

    The Tab Container gives you a way to include a lot of information on a page without creating one long, scrolling post. The tabs allow you to break up the information by category. You can include between 1 and 6 tabs, and the character limit for a tab title is 10 characters. 

  • C20 Rich Text Editor (RTE)

    The C20 RTE component is available on most AEM templates;

    • T01 Home Page
    • T02 Landing & Campaigns
    • T05 Biography Detail
    • T07 Article Detail
    • T08 Press Release Detail
    • T10 Places We Protect Detail
    • T17 Forms Page
    • Portal Content Page
    • Portal Homepage

    The rich text editor is a component that allows an an author to place and unlimited amount of text on a page and format that text. Rich text options include font styling, bulletted and numbered lists and some special characters. The preferred font styling for body content on nature.org is "paragraph" and the preferred heading style is "header 4."

C21 - C30

  • C21 Resource Listing

    The C21 Resource Listing component is available on the following templates: 

    • T02 Landing & Campaigns
    • T07 Article Detail 
    • T08 Press Release Detail 
    • T10 Places We Protect Detail 
    • Portal Content Page
    • Portal Homepage

    The C21 Resource Listing component is also available as a secondary-component option in the text-asset component. 

  • C23 Featured Number List

    The C23 Featured Number List component is available on the following templates: 

    • T02 Landing & Campaigns
    • T05 Biography Detail
    • T07 Article Detail
    • T08 Press Release Detail
    • Portal Content Page
    • Portal Homepage

    The primary purpose of this component is to display a list of items sequentially, such as steps or a "top-5" type list. Each item in the list includes the option for a link. 

  • Map (C24) - Updates coming soon

    The C24 Map component is available on the following templates: 

    • T01 Home Page
    • T02 Landing & Campaigns
    • T07 Article Detail
    • Portal Content Page
    • Portal Homepage

    This component embeds a google map and there are three variations: places we protect, generic & advanced. The places we protect varitation is for usage in tab 2 of the places we protect detail template only.  The generic & advanced maps can be used for articles and other templates where indicated.  The generic & advanced versions may have single or mutiple pins. Typically, the advanced map is only used in cases where over 100 pins are needed. Reach out to Global Digital for assistance by submitting a ticket at nature.org/digitalrequests

  • C25 Related Events (Auto)

    The C25 Related Events (Auto) component is available on the following templates: 

    • T02 Landing & Campaigns 
    • T03 Chapter/Program & Region Landing
    • T10 Places We Protect Detail
    • Portal Content Page
    • Portal Homepage

    The related events (auto) component uses AEM taxonomy - tags added to pages in the page properties - to pull in pages that match selected criteria. For example, you could create a related articles component with Climate Change articles and set it to pull in all articles tagged with the topic tag "Climate Change." The C27 Related Articles (Auto) component is also available as a secondary-component in the Text-Asset Component. 

  • C26 Media Gallery

    The C26 Media Gallery component is available on the following templates: 

    • T01 Home Page
    • T02 Landing & Campaigns 
    • T03 Chapter/Program and Region Landing
    • T05 Biography Detail
    • T06 Event Detail 
    • T07 Article Detail 
    • T08 Press Release Detail
    • T10 Places We Protect Detail
    • Portal Content Page
    • Portal Homepage

    The purpose of the media gallery is to display related images and/or videos relevant to the topic of a page. The component requires a minimum of 3 items and up to 15 items in the carousel. Both images and video items can be included in a single gallery. 

    Example page using media gallery (Page and link are subject to expiration)

  • C27 Related Articles (Manual) 

    The C27 Related Article (Manual) component is designed to cross-promote related stories (articles), blog posts & magazine content.  

    The C27 Related Articles (Manual) component is available on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns 
    • T03 Chapter/Program & Region Landing
    • T05 Biography Detail
    • T06 Event Detail
    • T07 Article Detail
    • T10 Places We Protect Detail

    In addition, the C27 Related Articles (Manual) component is available to use as a secondary component in the Text-Asset component with the "Text-Asset Variation Only" option from the Choose Variation dropdown. 

  • C28 Block Quote - No image

    C28 Block Quote - Image Right

    C28 Block Quote - Headshot Left

    The C28 Block Quote component is designed to provide a succinct inspiring quote that is relevant to the content.

    The component is available on the following templates: 

    • T02 Landing & Campaigns
    • T05 Biography Detail
    • T07 Article Detail 
    • T08 Press Release Detail 
    • T10 Places We Protect Detail
    • Portal Content Page
    • Portal Homepage

    In addition, the C28 Block Quote component is available as a secondary component within the Text-Asset component. 

C31-C40

  • C35 Connect Callout 

    This component is used as a contact/social callout primarily at the top of regional/chapter pages.

    The C35 Connect Callout is available on the following templates: 

    • T02 Landing & Campaigns
    • T03 Chapter/Program & Region Landing 
    • T04 Aggregation (Auto)
    • T10 Places We Protect Detail 
    • Portal Content Page
    • Portal Homepage

    Example page with component. 

  • C36 Email Sign Up Form - Full bleed background image

    C36 Email Sign Up Form - Two column layout with thumbnail image

    C36 Email Sign Up Form - No image

  • C37 Article Hero - Text Below Image

    C37 Article Hero - Text Over Image

    The article hero is designed as to be the main component visible when a visitor lands on an article page or a press release. It provides the visitor with an overview of the page content.  Variations include white text or black text (author choice) and display text on image or below image. 

    The C37 Article Hero component is available on the following templates: 

    • T07 Article Detail 
    • T08 Press Release Detail
    • Portal Content Page
    • Portal Homepage

  • C38 Image 

    This component is used to display a single image within long-form article pages and stories as well as pages that require a stand-alone image in-between other content components.

    The Image component is available on the following templates: 

    • T02 Landing & Campaigns
    • T05 Biography Detail
    • T06 Event Detail Page
    • T07 Article Detail 
    • T08 Press Release Detail
    • T10 Places We Protect Detail

  • C39 YouTube Video

    This component is used to display a single YouTube video within long-form article pages and stories as well as pages that require a stand-alone video in-between other content components. YouTube playlists can also be added in this component by using the Playlist ID in place of the Video ID. 

    The YouTube video component requires the YouTube ID to embed a video. If your video URL is https://www.youtube.com/watch?v=9AoSX-xaXHM the YouTube ID is 9AoSX-xaXHM.  Also important to note that the video title and description will not be pulled in from YouTube, so you will need to author these fields. 

    The C39 YouTube Video component is available on the following templates: 

    • T01 Home Page
    • T02 Landing & Campaigns
    • T05 Biography Detail
    • T06 Event Detail Page
    • T07 Article Detail 
    • T08 Press Release Detail 
    • T10 Places We Protect Detail 
    • T17 Forms
    • Portal Content Page
    • Portal Homepage

C41-C50

  • C41 Find a Local Chapter

    This component is used to guide a visitor to the chapter/program pages under "Where We Work" section of nature.org. 

    C41 Find a Local Chapter is available on the following templates: 

    • T01 Home
    • T02 Landings & Campaigns
    • Portal Content Page
    • Portal Homepage

     

  • C45 Visual Listing 

    The visual listing (manual) component is used to provide a listing of news, reports or other list type content.  

    This component is available on the following templates: 

    • T02 Landing & Campaigns
    • T05 Biography Detail
    • T07 Article Detail 
    • T13 Aggregation (Manual)
    • Portal Content Page
    • Portal Homepage

    Example page using component.

  • C47 Related People Feed 

    This component is used as a feed to provide visitor with a teaser/sample of TNC people. This may be used on influencer pieces to provide TNC contacts for followup on a topic. 

    This component is available on the following templates: 

    • T02 Landings & Campaigns
    • T03 Chapter/Program & Region Landing
    • T07 Article Details
    • Portal Content Page
    • Portal Homepage

     

  • C48 People Aggregation 

    The people aggregation component is designed to be used in the Our People section on nature.org. Each tab of the Our People section contains this component set to different parameters. 

    The component is available on the following template: 

    • Aggregation (Auto)
    • Aggregation (Manual)
    • Portal Content Page
    • Portal Homepage

     

  • C49 Location Menu Navigation

    The location menu is used on the chapter/program landing pages to navigate to the deeper State/Country pages.

    The Location Menu Nav is available on the following templates: 

    • T02 Landing and Campaigns 
    • T03 Chapter/Program Region Landing
    • Portal Content Page
    • Portal Homepage

    Example page with C49 Location Menu Navigation component. 

     

  • C50 Events Detail 

    The Events Detail component displays at-at-glance information on the events detail page.

    The component is available on the following template: 

    • T06 Events Detail 
    • Portal Content Page
    • Portal Homepage

C51-C60

  • C51 Biography Overview 

    This component provides a quick overview information for biography pages. Typically, for a staff member the component will include Areas of Expertise, Resources, Media Contact, and Scheduling Contact. 

    This component is available on the following template: 

    • Biography Detail 

  • C52 Text 4Up Link Component

    This component is used to highlight important content.  There is a minimum of 3, maximum of 8 link/title/short description blocks allowed.  4 are recommended from an authoring guide perspective.

    This component is available on the following templates: 

    • T02 Landing & Campaigns
    • T17 Forms Page
    • Portal Content Page
    • Portal Homepage

    Example of the component on a page on nature.org. 

  • C54 Accordion 

    The accordion component's primary usage is to provide a method in which to communicate short question and answer information.  The component can be used within a longer form copy page or as its own page along with the C56 anchor link component.

    This component library is using the Accordion component. 

    The C54 Accordion component is available on the following templates: 

    • T02 Landing & Campaigns
    • T07 Article Details Page
    • T10 Places We Protect Details
    • T11 Contact Listing & FAQs
    • T12 Contact Detail 
    • T17 Forms 
    • Portal Content Page
    • Portal Homepage

  • C55 Contacts Listing

    C55 Contacts Listing - People

    This component provides a listing of contacts at TNC - either a list of places (i.e. offices) or a list of people (i.e. staff).  Author can choose the type of content to display for each card in the 3 columns.  Author can add, reorder, and remove card items.

    The C55 Contacts Listing component is available on the following templates: 

    • T11 Contacts Listing & FAQs 
    • T12 Contact Detail
    • Portal Content Page
    • Portal Homepage

    Example page with C55. 

  • C56 Anchor Links 

    The anchor links component is used to help a visitor navigate quickly to information contained within a long form, listing or FAQ page.

    The Anchor Links component is available on the following templates: 

    • T02 Landing & Campaigns
    • T07 Article Details
    • T11 Contact Listing & FAQs
    • T12 Contact Details
    • Portal Content Page
    • Portal Homepage

    Example page using C56 component. 

  • C57 Social Share Component 

    This component is intended to function as a social sharing module that allows users to share the page on Facebook, Twitter, and LinkedIn. Users could also print or email the page. 

    When sharing on social media the following metadata will be used if available: Page title, Page Description, Page Type, Image, Site name, Open Graph URL.

    This component is available on the following templates:

    • Landing & Campaigns page
    • Chapter/Program & Region Landing page
    • Article Detail
    • Places We Protect 

     

  • C58 Article Aggregation 

    The article aggregation component is used to display stories, features and other long-form article content (excluding press releases).

    The C58 component is available on the following templates: 

    • T04 Aggregation (Automated) 
    • T05 Biography Detail
    • T13 Aggregation (Manual)
    • Portal Content Page
    • Portal Homepage

  • C59 Find a Local Event

    This component is used to help facilitate a preliminary search for events on the volunteer & attend events landing page.  When a location is chosen, it takes the user to an aggregation page set up for all TNC events.

    The component is available on the following templates: 

    • T02 Landing & Campaigns
    • Portal Content Page
    • Portal Homepage

     

  • C60 Basic Text Block

    The basic text block is used for short or longer form text content, like a biography. 

    The Basic Text Block is available on the following template: 

    • T05 Biography Detail 
    • T17 Forms
    • Portal Content Page
    • Portal Homepage

C61-C70

  • C61 Events Aggregation 

    Events aggregation aggregates events cards that users can click on to view details of a single event. It is a dynamic component which displays events and provides visitor with narrow down and search options. On nature.org this component is used on the voluteer and attend events landing page. 

    C61 can be used on the following templates: 

    • T04 Aggregation (Auto)
    • T13 Aggregation (Manual)
    • Portal Content Page
    • Portal Homepage

  • C62 Contact Detail 

    The contact detail component provides an at-a-glance overview of the most important contact info for contact detail pages.

    The C62 Contact Detail component is available on the following templates: 

    • T12 Contact Detail 
    • Portal Content Page
    • Portal Homepage

  • The Open Container Component (C63) is used to bring in external content that is outside of AEM onto a page. It can also be used to embed interactive media elements that are developed by the Global Digital Team.

    If you are interested in using an Open Container Component on a page, read the requirements and then submit a Marketing Requests Portal ticket on Jira Service Desk. 

     

  • C66 Visual Download

    C66 Visual Download Single Large

    The visual download component is meant to be used on article detail pages as a callout to featured reports or other document types.

    The C66 Visual Download component is available on the following templates: 

    • T02 Landing & Campaigns 
    • T07 Article Detail 
    • Portal Content Page
    • Portal Homepage

  • C67 Timeline 

    The timeline component is used to display content in a progressive format, typically used for displaying a history. 

    The C67 Timeline component is available on the following templates: 

    • T01 Homepage
    • T02 Landing & Campaigns 
    • T03 Chapter/Program & Region Landing 
    • T07 Article Detail 
    • T10 Places We Protect Detail
    • Portal Content Page 
    • Portal Homepage

    Example page using the C67 Timeline component. 

  • C69 Media Contacts

    The Media Contacts component is used for providing quick contact information on press release detail pages.  An author can add from minimum 1 to 4 maximum contact cards.

    The C69 Media Contacts component is available on the following templates: 

    • T02 Landing & Campaigns 
    • T08 Press Release Detail 
    • Portal Content Page
    • Portal Homepage

    Example page with C69 Media Contacts component. 

  • Callout Comp. Full-Width Image-Text (C70) 

    Callout Comp. Sidebar  (C70)

    The callout component is used for highlighting content on a page, like key takeaways. 

    The Callout component is available for use on the following templates: 

    • T02 Landing & Campaigns
    • T06 Event Details
    • T07 Article Detail 
    • T08 Press Release Detail 
    • T10 Places We Protect Detail
    • Portal Content Page
    • Portal Homepage

C71-C80

  • C72 Article CTA

    The article CTA is used to drive action on an article page.  It is meant to ONLY be used within the text of a long-form content article in a Text-Asset component.  There are two variations, one with a CTA button, one with a sign-up form.

    The Article CTA can be used on any page where a Text-Asset component can be used: 

    • T07 Article Detail
    • Portal Content Page
    • Portal Homepage

    Example page with C72 component. 

  • C73 Audio - w/ transcript expanded

    C73 Audio - Image

    C73 Audio - Text over image

    The audio component is used for embedding audio recordings on a page with the option of adding an image. 

    When using the audio component, audio files should be uploaded into the DAM and published, then linked in the component. 

    The C73 Audio component is available on the following templates: 

    • T01 Home
    • T02 Landing and Campaigns pages
    • T03 Chapter/Program and Region Landing pages
    • T07 Article Detail
    • T08 Press Release pages
    • T10 Places we Protect Detail
    • Portal Content
    • Portal Homepage

  • C74 Text List Callout (Horizontal)

    C74 Text List Callout (Stacked vertical)

    The text list callout component is used for listing content that includes an optional hyperlink. This now includes a stacked vertical variation for further authoring flexibility. 

    For an example, see the Membership Benefits text and images on the Become a Member page on nature.org. 

    The C74 Text List Callout component is available on the following templates: 

    • T02 Landing & Campaigns
    • Portal Content Page
    • Portal Homepage

  • C75 Press Release Aggregation

    The Press Release Aggregation component is used to aggregate all press releases in the TNC newsroom.

    The Press Release Aggregation component is available on the following templates: 

    • T04 Aggregation (automated) 
    • T13 Aggregation (manual)
    • Portal Content Page
    • Portal Homepage

  • C76 Tools & Resource Listing - Manual

    This component is used as a visual listing that requires manual curation. The items included in the listing can be internal or external, however this component is often used to link to external content. 

    Example of component use on nature.org. 

    The C76 Tools & Resource Listing - Manual component is available on the following templates: 

    • T04 Aggregation (Auto)
    • T13 Aggregation (Manual)
    • Portal Content Page
    • Portal Homepage

  • C79 Text Asset Component - Image

    C79 Text Asset Component - Image Portrait

    This component is used to facilitate wrapping of text around specific components.

    The secondary components that can be used in the Text Asset component are:

    • C38 Image
    • C72 Article CTA
    • C28 Block Quote
    • C70 Callout
    • C27 Related Articles
    • C27 Related Article (Auto)
    • C21 Resource Listing

    The C79 Text Asset Component is available on the following templates: 

    • T02 Landing & Campaigns
    • T07 Article Detail 
    • T08 Press Release Detail 
    • Portal Content Page
    • Portal Homepage

C81-C90

  • C82 Homepage Hero

    The Homepage Hero Carousel is for usage on the primary homepage of a site. This component is only used on the main nature.org homepage and the homepages of other TNC properties. 

    C82 Homepage Hero is available on the following page templates: 

    • T01 Home

  • C83 Homepage Feature

    The Homepage Feature is a component that highlights a feature coupled with a call to action newsletter sign-up form. This component is only used on the nature.org homepage and the homepages of other TNC properties. 

    The C83 Homepage Feature component is available on the following page templates: 

    • T01 Home
    • Portal Homepage

  • C84 Article Gallery

    The article gallery showcases stories & other important article-type content in a gallery on a homepage.  Minimum 3, Maximum 5 carousel items.

    The C83 Article Gallery component is available on the following templates: 

    • T01 Home
    • Portal Content Page
    • Portal Homepage

     

  • Homepage & Section Landing SCA (C85) 


    The Homepage SCA component is used to highlight TNC's main priorities (Shared Conservation Agenda).   Minimum 4, Maximum 5 items.

    The C85 Homepage & Section Landing SCA component is available on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • Portal Content Page
    • Portal Homepage

    Example page with C85 component - nature.org homepage. 

  • Featured Content Initiatives (C86)     

    This component is used on the homepage to feature important TNC action content coupled with a Quote.

    The Featured Content Initiatives component is available on the following templates: 

    • T01 Home
    • Portal Home

    See component on nature.org homepage. 

  • Lead Generation Form (C87)

    **This component should only be used in consultation with the Global Digital team. If you wish to use this the C87 Lead Generation Form, submit a digital request**

    Overview

    The Form call-to-action component is used to create promotional form types such as sign-ups and registration as well as providing an interface for users to donate. 

    Lead Generation

    • Contact Us - newsletter signup, membership queries, media queries
    • Other possible use cases: action center pledges, quizzes, email-signup for state events, event registration (can be quite complex), competitions like photo contest

    The C87 Lead Generation Form component can be used on the following templates: 

    • T02 Landing & Campaigns
    • T03 Chapter/Program and Region Landing
    • Portal Homepage
    • Portal Content Page

  • Partner Brand (C88)

    Partner Brand - Primary Logo (C88)

    This component is used to add a collection of logos for partners on a pages.

    The C88 Partner Brand component is available on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • T03 Chapter/Program and Region Landing
    • T04 Aggregation (Automated) 
    • T05 Biography Detail
    • T06 Event Detail 
    • T07 Article Detail 
    • T08 Press Release Detail 
    • T09 Places We Protect Landing
    • T10 Places We Protect Detail 
    • T11 Contact Listing & FAQs 
    • T12 Contact Detail 
    • T13 Aggregation (Manual)
    • Portal Homepage
    • Portal Content Page

C91-C100

  • Image Slider (C96) - White

    Image Slider (C96) - Green

    The Image Slider (C96) component allows an author to display before and after photos. Two photos are added to the component, with a slider bar that uncovers one image or the other. The slider can swipe up and down or left to right. Typically, the sliders are showing the same area of a landscape or a map at different points in time or with different elements highlighted. 

    Example page with image slider

    The Image Slider component is available on the following templates: 

    • T02 Landing & Campaigns
    • T05 Biography Detail 
    • T07 Article Detail 
    • T08 Press Release Detail
    • T10 Places We Protect Detail
    • Portal Homepage
    • Portal Content Page

     

  • Portal Log In (C100)

    C100 Portal Log In is the initial screen of the donor portal where donors can log in. This component is only used for the donor/audience portal. 

C101-C110

  • Forgot Password (C101)

    C101 Portal Forgot Password component is used to help portal users reset their passwords. It is an admin-only component that does not require custom authoring for each new donor portal. 

     

  • Change Password (C102)

    Allows portal users to choose a new password to use when logging into their portal. 

     

  • Portal Header (C103)

    This header will only be used for the donor portal site and includes the contact and profile popover.

  • Feature Collection – Full Bleed (C104)

    Feature Collection – Light Background (C104)

    Video Tutorial (how to author component)

    This component can be used for the hero on the donor portal homepage, or for a standard feature collection. The feature collection can include an optional greeting and a feature cta, along with 1-4 featured items (e.g., articles, documents). 

    The Feature Collection component is available for use on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • Portal Home
    • Portal Content Page

     

  • Statistics (C105)

    Statistics (C105) - Short Description

    Video Tutorial (How to author component)

    The Statistics component can be used to highlight important statistics/figures using numbers and icons.

    The C105 Statistics component is available on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • T03 Chapter/Program & Region Landing
    • T06 Event Detail 
    • T07 Article Detail 
    • T08 Press Release Detail
    • T10 Places We Protect Detail 
    • Portal Content 
    • Portal Homepage

  • Pie Chart (C106)  

    Video Tutorial (how to author component)

    The pie chart component should be used to show how individual parts make up the whole of something. On the donor portal, this may be used to show the breakdown of an individuals giving into different projects or geographic regions. 

    The Pie Chart component is available on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • T07 Article Detail 
    • T08 Press Release Detail 
    • Portal Content 
    • Portal Homepage

     

  • Column Chart - Stacked (C107) 

    Column Chart - 10 Items (C107)

    Column Chart – Wide (C107)

    The column chart can be used to show a comparison among different items, or show a comparison of items over time. The stacked column charts can be used to display the contributions of parts of a whole.

    The Column Chart is available on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • T07 Article Detail 
    • T08 Press Release Detail
    • Portal Content 
    • Portal Homepage

  • Line Chart - Wide (C108) 


    Line Chart - Small (C108) 

    The line chart shows how a data set performed during a specific time period or relationship between data sets.

    The Line Chart is available on the following templates: 

    • T01 Home
    • T02 Landing & Campaigns
    • T07 Article Detail 
    • T08 Press Release Detail
    • Portal Content 
    • Portal Homepage

  • Document Download - List (C109)

    Document Download – Grid (C109)

    This secure document component is used to store documents in the donor portals via Box API. Allowed only in donor portals. 

  • Events & Trips Aggregation (C110)   

    The C110 Events & Trips Aggregation component will be used to aggregate events and trips (past and future). 

    The Events & Trips Aggregation (C110) component is available only on donor portal pages. 

C111-C120

  • Image Mosaic – 5 displayed (C111)


    Image Mosaic – 10 displayed (C111)


    Image Mosaic - Modal (C111)

    Video Tutorial (how to author image mosaic)

    The purpose of the image mosaic is to display related images and/or videos relevant to the topic of the page, or link to a full album.

    The Image Mosaic is available on the following templates: 

    • T01 Home Page
    • T02 Landings & Campaigns
    • T03 Chapter/Program Region Landing
    • T06 Event Detail
    • T07 Article Detail
    • T10 Places We Protect Detail
    • Portal Content Page
    • Portal Homepage

  • Photo Album Aggregation (C112) - photos

    Photo Album Aggregation (C112) - album

    This component is used to pull details from photo albums into album preview and all photo views. The best way to use this component is to create photo album folders for photo collections in the DAM within one larger photo folder. Then create a page with a photo album detail component for each collection. Then, link those photo album pages in the photo album aggregation component.  

    The Photo Album Aggregation component is only available for use with the Donor Portal Pilot, on the Donor Portal Content template. 

     

     

     

  • Photo Album Detail (C113) 


    This component is used to create a photo album, which can later be used in the aggregation component.

    The Photo Album Detail component is for use only with the Donor Portal Pilot and only available on the Portal Content page template. 

  • Video Aggregation (C114)   

    This component is used to display a library of videos and can be used within C19 Tab Container along with documents and photos for the donor portal.

    Videos can be hosted on either Vimeo or YouTube. 

    The Video Aggregation component is only for use on the Donor Portal and only available on the Portal Content page template. 

  • Vimeo Video (C115)


    This component is used to display a single video within long-form article pages and stories as well as pages that require a stand-alone video in-between other content components. The component pulls in videos hosted on Vimeo using the Vimeo ID. 

    This component is availble only on the Portal Content page template. Videos on Nature.org should be streamed from YouTube. 

  • Globe (C116) 


    Globe Modal Detail

    Globe List

    Video Tutorial (how to author component)

    The globe can be used to mark significant locations and provide details on events, initiatives, etc. that have taken place there. The component places markers on a globe, and when markers are clicked information about the item is displayed in a panel. 

    The Globe component is available on the following templates: 

    • T02 Landing & Campaigns
    • Portal Content

  • Impact Map (C116) - This is currently available for Donor Portal usage only. 

  • Scrolling Slideshow (C117)

    Video Tutorial (how to author component)

    The Scrolling Slideshow component is used to display content in a progressive format, typically used for displaying history. The user scrolls through content and images fade in and out as they correspond to the text. 

    The Scrolling Slideshow component is available on the following templates: 

    • T02 Landing & Campaigns
    • T07 Article Detail 
    • Portal Content
    • Portal Homepage

  • C120 Interactive Points Over Image Scroll to see all variations (Examples 1&2 = Tooltips: Dark; Example 3 = Tooltips: Light; Examples 4&5 = Points)

    This component allows users to author an interactive experience with clickable points on an image. Clicking those points would change the display of information in the description panel as well as the option to change the featured image. Two interactive variations are available: tooltips and points.

    This component will be full-width when added to a page. Content will not wrap around the Points Over Image component. 

    On mobile the primary image will always appear above the Description panel instead of to the right. 

    On desktop the primary image will always appear on the right.

    The Interactive Points Over Image component is available on the following templates: 

    • T07 Article Detail 
    • Portal Content Page
    • Portal Homepage

C121-C130

C131-133

  • Vertical Timeline (C131)

    This vertical scrolling timeline displays a series of cascading milestone cards. This timeline allows for the display of month and year, title and descriptor, and an accompanying image or video of the milestone.

  • This component allows for the emedding of a live Facebook streaming video. Use the URL of the Facebook video to configure the player. 

  • Interactive Tiles (C133) - Text Over Image

    Interactive Tiles (C133) - Text Below Image

    Interactive Tiles (C133) - No Text

    This component functions as a collection of clickable tiles that open a detailed lightbox to reveal more information. This enables quick browsing of information without visitors having to depart the page. 

    To see the modal view, click on the first tile of the prototypes.