Skip to main content
Apply Visit Give

Reference

The Reference component allows you to mirror content from a source page onto other pages. This is useful when a block of content must be visible on two or more pages.

Uses

Screenshot showing an arrow icon, which indicates the content outlined in green is referenced from another page

When you're in AEM edit mode, you'll sometimes see an arrow icon.

The arrow is the symbol for the Reference component. It means the content inside the green lines lives on another page, which we call the source page.

Screenshot showing Reference field, containing the path and details of a reference

The content is mirrored from the selected content block on the source page to pages with a Reference component pointing the selected content block.

When you update the content block on the source page, the changes will be reflected in all the Reference components connected to that content block. 

Screenshot showing a grey box announcing amounts of special funding for out-of-province students

For example, when someone updates the special funding amounts for Arts and Science students on the source page, the updates will show on all the Faculty of Arts and Science pages that reference that content block.

This saves time because you only have to make changes in one place rather than many. Plus, it ensures all the pages have the same information.

Best practices

Existing Reference components

  • If your page already has a Reference component, don't delete it. It's usually there for a very good reason!
  • You can't edit the referenced content from a Reference component. It can only be edited on the source page.
  • If the content on the source page needs to be edited and you don't have editing access, email your unit's Communications Advisor and cc websupport@concordia.ca. They'll ensure the needed updates are made.
  • If the referenced content is removed from the source page, you'll see an error message on all pages which mirror that content. If you see an error message, contact websupport@concordia.ca right away.

For a new Reference component

  • From a Concordia.ca site, you can reference content blocks on other Concordia.ca sites but not Carrefour.
  • From a Carrefour site, you can reference content blocks on other Carrefour sites but not Concordia.ca.
  • The Reference component works best with a single component. It works especially well with a Box component or a Grid Container component. When you reference a box or grid container, everything inside the box/grid container can be changed at any time and the references stay intact, i.e., the change does not break the references.

Set up a Reference component

Screenshot showing the AEM sidekick. The Reference component is located in the Components, General section.
  1. On your AEM page, add a Reference component where you'd like the referenced content to appear.
  1. Open the Reference component for editing.
Screenshot showing dropdown arrow beside the Reference field
  1. Click the dropdown.
Screenshot showing list of websites on left, with one in green, and the site's content blocks on the right, with one in red
  1. Navigate to the source page of the content you'd like to reference. Click once on the source page, so it turns green.
  2. Click on the specific content block you'd like to reference, so it's outlined in red.
    This step can be a bit tricky, as the content blocks aren't always as clearly labelled. Do your best. You can always repeat this step if you don't get it right the first time.
  3. Click Select, then OK.
  4. The referenced content block will appear on your page.
    Double check that it's the correct content block. If it isn't, repeat step 5 until correct.
  5. Activate the page.

Accessibility

The Reference component doesn't have accessibility settings. However, the source content must have:

  • Proper headings 
  • X-Large paragraph text
  • Alt text for images
  • Descriptive links
  • Descriptive button labels

Try it out!

Set up a reference component on our practice page

© Concordia University