Creating inherited web parts

✖
Copy to clipboard

Web part inheritance allows you to create specialized web parts based on other web parts. Inherited web parts use the same code files as the original, but you can:

To create an inherited web part:

  1. Open the Web parts application.
  2. Select the category where you want to place the web part.
  3. Click New web part.
  4. Select Inherit from an existing as the Web part option.
  5. Type a Display name for the inherited web part.
  6. Choose the parent web part through the Inherit from selector.
  7. Click Save.

Inherited web parts work like regular standalone web parts. The main difference is that inherited web parts have the Inherited from field showing the parent web part instead of the File name selector that specifies the source file.

Modify the properties of inherited web parts on the Properties tab.

You can:

  • Set the Default value for properties
  • Determine whether properties are visible in the web part configuration dialog (Display field in the editing form)
  • Modify the appearance and behavior of properties
  • Add additional properties

You cannot:

  • Remove inherited properties
  • Change the Field name, Data type or Size of inherited properties

Tip: Click Reset field to revert all settings of a modified property back to the original state (the system copies the property settings from the parent web part).

When you add new instances of the web part to a page, the system pre-configures the properties according to the specified values.

Example - Creating an inherited web part for displaying news

The following example shows how to create a news list web part inherited from the Repeater web part. The news list displays news articles by default, without requiring any configuration of the web part properties. This example assumes you are using the sample Corporate site. You can perform the example on any other site, but you will need to use your own transformation to make the web part display data.

  1. Open the Web parts application.

  2. Select the Listings and viewers category.

  3. Click New web part.

  4. Specify the following values:

    • Web part: Inherit from an existing

    • Display name: Custom news list

    • Inherit from: Listings and viewers -> Pages -> Repeater

      Creating an inherited web part

  5. Click Save.

  6. On the General tab, select Skip initial configuration and click Save again.

  7. Switch to the Properties tab of the newly created web part.

    • Here you can see the properties of the parent web part and override their default values or other settings.

  8. Set the default values for the Path property:

    1. Select Path in the list of fields.

    2. Type /% as the Default value.

    3. Click Save.

      Setting the default value for the property of an inherited web part

  9. Repeat the previous step for the following properties and default values:

    • ClassNames: cms.news
    • OrderBy: NewsReleaseDate
    • TransformationName: cms.news.preview

Tip: You can also customize the properties of the inherited web part by adding new fields.

Result

Now you can add the inherited web part to the site:

  1. Open the Pages application.
  2. Choose a page in the content tree.
  3. Switch to the Design tab.
  4. Add the Custom news list web part to the page.

The web part displays all news items from the site without requiring any additional configuration.

Note: After adding an instance of an inherited web part, users can set the properties to any other values. The default values only make it easier to add web parts with specialized functionality (without requiring any configuration).