Bynder is a digital asset management platform (DAM) that allows you to store, manage and organize your digital media files. Marketing and development teams are the primary users of Bynder.
Bloomreach Content integrates with Bynder, which links your [Bynder Universal Compact View](🔗) with our _Experience Manager_ in the CKEditor. After successful integration, you can upload and publish media asset files directly from your Bynder account into your Bloomreach Content-powered website.
Currently Bloomreach Content supports Bynder Universal Compact View library [version](🔗) 3.2.3
Please make sure to have an account with Bynder. Once you login into your account, follow the below steps to get your Client ID and Client Secret details:
Click the "settings gear" icon to launch the dropdown menu.
In the dropdown menu, hover over "Advanced Settings."
Click "Portal settings" in the "Advanced Settings" menu.
In the "Portal Settings" page, Click "OAuth Apps" on the left navigation bar.
If you've already created an application, use that application to obtain a Client ID and Client Secret, otherwise follow the below steps:
Click the "Add new app" button.
Enter your application name.
Choose Grant Type as "Client Credentials" in the select box.
Choose the assigned user.
Set the desired scope for that application.
Check the "meta.assetbank:read" property.
Click "Register Application" to add an application.
Once an application is generated, copy and paste the Client secret to a secret location. (if you lost the secret, you need to regenerate it and update the application)
## Bloomreach Content
Please make sure that Bynder is available as part of [Bloomreach Integrations Library](🔗), as depicted below.
# How to Install the Bynder Integration?
From your Bloomreach Content instance:
Open the [Bloomreach Integrations Library](🔗) page.
As part of the _Available integrations_ section at the bottom, you should be able to see Bynder.
Click on the _Add_ button.
The Bynder integration page will show: please add the fields based on the table below.
|Column Title||Column Title|
|**Name** (required)||Name of the Bynder integration.|
|**Integration ID** (required)||Unique identifier for the Bynder integration. This ID is defined by the customer and used for internal purposes only.|
|**Description**||Description of the Bynder integration.|
|**Bynder domain** (required)||URL that has been used to login into the Bynder Account.|
|**Mode** (required)||Set the mode to allow single or multiple digital media asset selections.|
|**Type** (required)||Choose the type of digital media asset in the dropdown.|
|**Client ID** (required)||Bynder application Client ID.|
|**Client Secret** (required)||Bynder Application Client Secret.|
|**Height**||The initial height of the iframe - derived from the Field extension field - in pixels. When omitted, 150 is the default value.|
|**CSP Properties**||The [Content Security Policies](🔗) value returned by Content SaaS. it is needed while previewing digital media assets as part of the Content SaaS: please be careful with this property. Since the Content application will load any resource specified as part of the URL.|
Optional: Use the “Test connection” button to verify the Bynder application fields. If Bynder input fields (Bynder domain, Client ID, and Client Secret) are valid, it will show the success toast message or throw a failure message.
Finally, click the “Add” button to add Bynder integration into Content.
Please find more information about Bynder and its properties in [Bynder documentation](🔗) and [Bynder Universal Compact view](🔗).
## Field extension field
An Field extension field uses the [document field extension point](🔗) to display a custom field type. When a Bynder integration is available (e.g., Bynder Marketing), document editors can add a _Field extension_ field to the desired content type and link it to the integration using the _Integration_ drop-down.
Once the Field extension field is correctly configured, editors can include Bynder digital media assets directly within the document using the _Select asset(s)_ button rendered in the editing template .
If you’ve configured Bynder with the proper credentials, you should see the Bynder Compact View dialog.
## CKEditor Field
A CKEditor field is used to store fully featured rich text content, stored as HTML markup within the document. To have the Bynder integration as part of the CKEditor field, manually enable the CKEditor Bynder plugin needs as part of the _[ckEditorAppendedJson](🔗)_ field, like the following:
More specifically, you can use the snippet below
If everything goes well, you should be able to see the Bynder icon as part of the CKEditor!