Computer Magic Logo
Content Picker

Wednesday, October 26, 2016

Published by Aristotelis Pitaridis

Content Picker allows the administrator to select a content from the Content’s tree. Below we can see an example of creating a Content Picker property:

The My Content Picker property has the following appearance when we edit the document:

In order to select a Content we have to click on the Add link. The Content selection panel will appear on the screen.

To choose a Content we press on it with the mouse. To open a Content and see the child Contents we have to hover over the Content and an arrow will appear on the left side of the content’s name. If you click on the arrow, the Content will open and display the child contents.

Once we locate the Content that want to choose, we click on it and our selection appears on the right side of the property.

The Node ID of the content we choose will stored in the property. In order to read the value as a strongly typed object we use the following code:

@{
    if (Model.Content.HasValue("myContentPicker"))
    {
        var node = Umbraco.Content(CurrentPage.myContentPicker );
        <a href="node.Url">@node.Name</a>
    }
}

In order to read the value using dynamic properties we use the following code:

@{
    if (CurrentPage.HasValue("myContentPicker"))
    {
        var node = Library.NodeById(Model.myContentPicker);
        <a href="node.Url">@node.Name</a>
    }
}