Basic Info

You can display content from a source component onto other areas on multiple pages with the Reference component. When you update content in the original component, all references are automatically updated as well.

Example

The above content is referenced from the Component Tutorials landing page.

Tutorial

  1. Navigate to and open your page.
  2. Add the Reference component.
  3. A new Reference component without content will appear on the page. This space will be labeled "Reference."
  4. To edit the component, click or touch on this space. The component toolbar will appear above.
  5. Click on the wrench icon to configure. 
  6. An edit window will appear so you can locate the component you want to reference on your page.
  7. In the Reference field, click the folder and magnifier icon to browse for a source component to reference.
  8. A new window will appear containing a site hierarchy. Navigate to the page and component that you want to reference. 
  9. Click once on the page you want to reference so that a checkmark appears and click the blue checkmark icon to select. 
  10. Click or touch the checkmark to save and close the dialog window. 

^ Back to top

Create a Hidden Reference Page

It is important to know where the original source Reference component is. This will make it easier to update content, reference on other pages, and prevent accidental component deletion.

If your department has several references that are used often, we recommend creating a hidden page where all of your referenced content can live. This way when you need to update or reference content, you only have to go to a single page.

  1. Create a new page.
  2. Hide the page in navigation.
  3. Add components to your page to reference.
    1. Note: Do not relocate content on your page into different column spaces after they have been referenced, this will cause the reference to break and layout errors to occur on any pages referencing your content.
    2. Note: Do not reference another reference as they are difficult to manage and may cause errors in the layout display.
  4. Activate your page.

^ Back to top

Update Broken References

Broken references cause layout problems with the page footer. A partial version of the footer may appear on the side of the page or the footer may no longer extend to the full width of your browser window. If you notice either of these things occurring to the footer while on one of your pages, then your page contains at least one broken reference that needs to be updated or deleted.

Broken references may occur for any number of reasons:

  • The referenced component no longer exists on the original page;
  • The referenced component has changed locations within the original page;
  • The page containing the referenced component is no longer active; or
  • The page containing the referenced component no longer exists.

^ Back to top

Screenshots

Reference component dialog

Select a path to the reference.

Selecting content to reference

Browse to and select the particular component on the page to reference.

Example of a page with a broken reference

Pages that contain broken references will also have footers that appear distorted. If a partial footer appears on the side of the page or if the footer does not extend to full width of your browser window, then the page you're viewing contains broken references.