For a better experience, click the Compatibility Mode icon above to turn off Compatibility Mode, which is only for viewing older websites.

Adding Components to a Page

Setup Summary

In general, the order of operations for adding a new component to a page is as follows. Further directions are provided below.

  1. Create the the desired component in the site's Extras Folder (called the "Data Source")
  2. On the page the component is to be added to, open Presentation > Details in the Sitecore ribbon
  3. Select the type of component you want to add
  4. Assign the component to an area on the page (called the "placeholder")
  5. Point the component to the previously created Data Source in the Extras Folder
  6. Save the page and Approve for Publication

Page Layout

Before adding a component to a page, it's important to understand Sitecore's page layouts and their respective placeholders. Commonly used page layouts are the 3 Column layout and the 2 Column - Left Nav layout.

See Content Layouts for a complete list of Drexel's page layouts.

Placeholders tell Sitecore where to include the component on the page. There are 2 commonly used placeholders:

  • CenterRail - placeholder for information to be included in the 2nd column of a 3 column layout
  • RightRail - placholder for information to be included in the 3rd column of a 3 column layout. It is used mostly commonly for sidebars.



Adding Components to a Page

  1. Select the Component to add to the page

    1. In the Sitecore ribbon, click Presentation then Details.

      Presentation Details

    2. In the Layout Details dialog box, click Edit.

    3. The Device Editor dialog box opens. Click Controls in the list on the left, then click Add on the right.

    4. Navigate to the component type in the Renderings or Sublayouts folder.

      Datasets are the only component type found in the Renderings folder. All other components are in the Sublayouts folder.

      Open the accordion below for the locations of the most commonly used components.

      Components locations in the Select a Rendering dialog box

      Dataset Renderer
      Renderings/V2/DatasetRenderer

      FAQ
      Sublayouts/V2/Components/FAQ

      Quick Links
      Sublayouts/V2/Components/Quick Links/[LINKTYPE]

      Sidebars
      Sublayouts/V2/Sidebar/[SIDEBARTYPE]

      Slideshow
      Sublayouts/V2/Components/Slideshow

      Snippet
      Sublayouts/V2/Components/Snippet


  2. Assign the component to an area on the page (the "placeholder")

    1. In the Add to Placeholder field, type either CenterRail or RightRail.
    2. Check Open the Properties dialog box, the click Select.

  3. Point the Component to the Data Source in the Extras Folder

    1. In the Control Properties dialog box, click Insert Link.

    2. Navigate to the previously created component in the Extras Folder and click it.
    3. Click Open. The dialog box will close; click OK to close all remaining dialog boxes.
  4. Preview and Publish

    1. To review the page, click Review in the Sitecore ribbon, then click Display.
    2. To publish the page, click Publish in the Sitcore ribbon, then click the Publish icon (looks like a globe).

      Note: you must Publish a page after you change the Presentation Details -- this is different from the "Approve for Publication" function that you do after editing the contents of an item.