The Aprimo content selector is a pre-built UI to use Aprimo DAM as a tool for users to select content items in 3rd party systems. The Aprimo content selector can be launched in either ID mode or CDN mode. ID mode will return the record ID of the selected asset, and CDN mode will also return the public uri of the asset. Public CDN is required for CDN mode. The record ID that is returned can be used in the Aprimo REST API to get metadata on the selected record, and the public uri returned in CDN mode can be used to place the content in a field or on a page.

Content Selector


To open the Aprimo DAM in Content Selection mode you need to call a dedicated endpoint:

The Aprimo Content Selector can only be used in a stand-alone browser window (or browser tab).

If the user is not yet logged in to Aprimo, the user will first be redirected to the login page. After successfully authenticating, the user will be presented with the Aprimo Content Selector and can start selecting content items.

Once the user has made a selection and clicked the button that accepts the users selection, the Aprimo Content Selector will call the opener back using the postMessage API provided, which is supported by all modern browsers (see documentation on MDN ).


The Aprimo Content Selector can be customized with following options:

Option Data type Description Default
title string The title to display in the Aprimo ContentSelector Adapts to select option
description string The description to display in the Aprimo ContentSelector (no description)
accept string The label of the button to confirm a selection 'Select'
limitingSearchExpression string A DAM search expression to control the presented content items. The context of the search expression is always Record. See Searching for records for more information. '*'
select ‘single’, ‘multiple’, ‘singlefile’, or ‘singlerendition’* Specifies whether the user can select a single asset, multiple assets, a file (main file or a rendition), or a single public rendition*.
*For more information about the mode ‘singlerendition’, see the section labeled “Content Selector – CDN Mode”.
dialogMode ‘fullscreen’ or ‘default’ Specifies the dialog mode of the content selector. This controls the placement of the dialog buttons: default puts the buttons at the bottom, fullscreen puts them in the header bar Note: When ‘singlerendition’ is the passed value for the ‘select’ option then ‘dialogMode’ will be fullscreen. 'default'
facets string[] An array of facet names to use in the Aprimo Content Selector. The specified facet names must refer to registered facets and the names are case sensitive. When no facets are specified, the facets configured for search will be used. To disable facets, specify an empty array. (no value)
targetOrigin string Specifies what the origin of targetWindow must be for the event to be dispatched (see documentation on MDN ) '*'

To provide the options to the Aprimo Content Selector, you must construct a JSON object containing the options you want to control and convert it into base64-encoded string. As an example:
const selectorOptions = {
title: 'Select logo',
description: 'Select the logo that will be used on the printed brochure',
limitingSearchExpression: ' = 3a6499d4865f446b8711a8b90098ec55',
accept: 'Use this logo',
select: 'single'
const tenant = '<tenant name>'
const encodedOptions = window.btoa(JSON.stringify(selectorOptions))
const url = `https://${tenant}${encodedOptions}`
document.write(`<a target='_blank' href='${url}'>Show selector</a>`)

Dealing with Special Characters

When your JSON object contains property values with characters outside of the Latin1 range, you cannot use the browser’s window.btoa method. To circumvent this, you can use a little trick by first using the encodeURIComponent method before using the btoa method. To optimize the size of the string, you must apply an unescape as well.
function encode(stringToEncode) {
return window.btoa(unescape(encodeURIComponent(stringToEncode)))

Content Selector - CDN Mode

Using the select option of ‘singlerendition’ will cause the content selector to launch in CDN mode. CDN mode will only display assets that have been pushed to the public CDN. When an asset is selected in CDN mode a new view will open prompting the user to select a specific rendition of the asset. When the user presses the Accept button, the data is returned like normal. In CDN mode the data returned also contains the public uri of the selected rendition (See section: Callback).


When the user clicks either the accept or cancel button in the Aprimo Content Selector, the selector will perform a callback to the originating window, in the browser. To achieve this communication, the postMessage API is used. In order to handle this communication, you need to listen for message events.
window.addEventListener("message", handleMessageEvent, false)

Note: these messages don’t always work correctly when running a page at a file:// URL

The will contain a JSON object, which specifies the following properties:

Property Data type Description
result string Contains either 'accept' or 'cancel', indicating the button the user clicked on
selection Selection[] When the user clicked the accept button, the selection property will contain an array of Selection objects. When the user canceled the operation, the selection property will be undefined. The id property of the Selection object is the record id of the selected record in DAM. The  rendition object contains the ID and public link of the selected rendition if the ‘singlerendition’ selection mode is used.

The TypeScript definition of the Selection object is:
interface Selection {
id: string,
title: string,
rendition?: {
id?: string,
publicuri?: string

Additionally, when a crop, trim or preset rendition is selected in the content selector in ‘singlefile’ mode, the following information is returned in the additionalFile property:

id: string,

title: string,

additionalFile: {
   additionalFileId: string,
   fileName: string,
   type:string //"Crop", "Trim" or "Custom" (for rendition preset)

Example implementation

<button id="openSelector">Open selector</button>
const tenantUrl = ''
const aprimoContentSelectorUrl = tenantUrl + '/dam/selectcontent#options=<encoded options>'
const handleMessageEvent = (event) => {
// Ensure only messages from the Aprimo Content Selector are handled.
if (event.origin !== tenantUrl) {
if ( === 'cancel') {
alert('You have canceled the selector')
} else {
const ids = =>
alert("You have selected following ids:\n\n" + ids.join('\n'))
const openSelector = () => {, 'selector')
window.addEventListener("message", handleMessageEvent, false)
const button = document.getElementById('openSelector')
button.addEventListener('click', openSelector)

Note that the Aprimo Content Selector will automatically close the browser window.