Cloudinary

Introduction

Cloudinary is a digital asset management (DAM) platform which allows you to store, manage and optimize your media assets, primarily used by marketing and development teams.

Bloomreach Content offers integration with Cloudinary, which links your Cloudinary Media Library Widget with our Experience Manager in the CKEditor. After successful integration, you can easily upload and publish images, videos, PDFs, or other stored raw files directly from your Cloudinary account into your Bloomreach Content-powered website.

Requirements

Cloudinary

Please make sure to have an account with Cloudinary with a Cloud set up: in your account detail page, you should be able to see both the Cloud Name and API key properties.

1228

Bloomreach Content

Please make sure that Cloudinary is available as part of the Bloomreach Integrations Library, as depicted below.

1242

How to install the Cloudinary 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 Cloudinary.
  • Click on the Add button

The Cloudinary integration page will show: please add the fields based on the table below.

Property nameDescription
Name (required)Name of the Cloudinary integration
Integration ID (required)Unique identifier for the Cloudinary integration
DescriptionDescription of the Cloudinary integration
Cloud Name (required)The cloud_name of the Cloudinary account to access
Allow multi-select of filesWhether to allow users to select multiple images from the Media Library asset grid
Maximum number of files to selectMax number of media assets that can be added during a single session. Relevant when Allow multi-select of files is selected
API Key (required)The Cloudinary account API key
User nameThe Cloudinary user name to use when logging in to the account
Default TransformationTransformation JSON object containing one or more transformations you want to apply to every inserted media asset
HeightThe initial height of the iframe - derived from the OpenUI String field - in pixels. When omitted, 150 is the default value
CSP Propertiesthe Content Security Policies value returned by Content SaaS. It is needed while previewing 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

The Cloudinary-related properties are also documented in the Cloudinary Widget Media Library documentation.

OpenUI String field

An Open UI String field uses the document field extension point to display a custom field type.
When a Cloudinary integration is available (e.g., Cloudinary Marketing), document editors can add an Open UI String field to the desired document type and link it to the integration, using the UI extension drop-down like below.

474

Once the Open UI String field is correctly configured, editors are able to include Cloudinary Assets directly within the document. Please click on the “Select Asset(s)” button: if you haven’t logged in yet, sign-in is enforced.

800

If everything goes well you should be able to see a the Cloudinary Media Library dialog!

1999

Rich-text field

A Rich Text Editor field is used to store fully featured rich text content and it is stored as HTML markup within the document. To have the Cloudinary integration as part of the rich text field, the CKEditor Cloudinary plugin needs to be manually enabled as part of the ckeditor.config.appended.json field, like the following:

796

More specifically, you could use the snippet below:

{ "extraPlugins": "iframedialog,cloudinarymediapicker", "pluginConfigs": { "cloudinarymediapicker": { "integrationId": "<INSERT_YOUR_INTEGRATION_ID>" } } }

If everything goes well, you should be able to see the Cloudinary icon as part of the CKEditor!