The following examples show how to use `ContentReference` to link to different types of content, for example images and folders.

📘

Note

The code example refers to images and media using a content reference. Optimizely Content Management System (CMS 7) uses a URL in the following code.

Both types are supported in CMS 7.5 and later versions, but you should use `ContentReference`.

If you use a URL, CMS converts the value from its internally permanent URL format to a public and user-friendly format. It is an additional step to do that has a small impact on performance. For example, when you want to append information to a URL, such as the size or format to use for an image, you must use the URL type because the `ContentReference` stores only the reference and not additional information.

The following image shows how block selection dialog box appears. The dialog box shows folders and blocks only. Folders are not selectable.

If you skip the UI hint and get a selection for any content on the site, the dialog box appears as follows:

## Customize selection of content

If you want to narrow down selection, use the `AllowedTypes` attribute to define what you can select:

You also can further customize the selection by specifying custom roots for the dialog box by creating a custom editor descriptor that inherits from `ContentReferenceEditorDescriptor<T>`. The following example uses a hard-coded content reference for simplicity (but it is not a recommended approach).

📘

Note

The examples in this topic control what you can drag and drop to a field, (except for the custom roots setting because it affects only what is visible on the dialog box). For example, you can drag and drop a `TeaserBlock` from a location other than under the custom root with the id 52.