A Strong Performer in The Forrester Wave™: Digital Experience Platforms, Q4 2025
CS-log-dark.svg

Brightcove App Installation Guide

The Brightcove platform is a cloud-based solution for online video streaming, which facilitates the hosting, sharing, and streaming of video content by organizations. Marketers and creatives can utilize the platform to efficiently organize, control, create, distribute, and measure all their video assets, with the added benefits of scalability, reliability, and security.

Contentstack Marketplace lets you install the Brightcove app and use it within your stack to fetch and display videos from the Brightcove account within your entries.

Prerequisites

Let's follow this step-by-step guide to install and configure Brightcove within your stack.

Steps for Execution

  1. Retrieve the Credentials for your Brightcove account
  2. Install and Configure the Brightcove app in Marketplace
  3. Use the Brightcove app within your Entry

  1. Retrieve the Credentials for Your Brightcove Account

    To get your configuration details for Brightcove, follow the steps given below:

    1. Log in to the Brightcove account using your Brightcove credentials.
    2. Click the Admin settings icon, as shown in the screenshot, to get the account information.
      Click to enlarge
    3. Copy the Account ID from the Account Information section to use this in step 2 during app configuration.
      Click to enlarge
    4. Go to the API Authentication section and click the + Add application button.
      Click to enlarge
    5. Enter the Name and Description, and then select the required accounts from Select Accounts for Authorization.
      Click to enlarge
    6. Scroll down to the Exposed Brightcove APIs section. Under CMS options, mark Video Read, and then click Save.
      Click to enlarge
    7. Copy the Client ID and Client Secret for use in step 2, then click Okay, I copied it to close the dialog box.
      Click to enlarge

  2. Install and Configure the Brightcove App in Marketplace

    To install the app in Contentstack, log in to your Contentstack account and follow the steps below:

    1. In the left-hand side primary navigation, click the Marketplace icon.
      Click to enlarge
    2. Click Apps from the left panel.
    3. Within the Marketplace, you can see the available apps. Hover over the Brightcove app and click Install.
      Click to enlarge
    4. In the pop-up window, select the stack where you want to install the Brightcove app, accept the Terms of Service, and click the Install button.
      Click to enlarge
    5. On the Configuration screen, enter the following details:
      1. Brightcove Credentials: Enter the Brightcove Account ID, Brightcove Client ID, and Brightcove Client Secret retrieved from your Brightcove Account in step 1.
        Click to enlarge
      2. Choose the Brightcove Keys to Save in Entry: Choose how to save the data fetched from the Brightcove account in Contentstack entries.
        1. If you select the All Fields option, you can select only a limited number of assets in the entry.
        2. For Custom Fields, you can search and add specific Brightcove Keys you want to save in entries. By default, the id and name of the assets are selected.
        Click to enlarge
    6. Click the Save button.
    7. On the UI Locations tab, you can see the predefined app locations. You can use the toggle button corresponding to each UI location to enable or disable it based on your requirements.
      Click to enlarge

      Note The app requires at least one UI location to be enabled, otherwise you will not be able to save your app configuration settings.

    8. If the webhook is enabled for your app, you can view the webhook logs under the Webhook tab.

      Additional Resource: For more information on UI location and webhooks, please refer to the Installed Apps guide.

    9. Click Open Stack to start using the Brightcove app.

  3. Use the Brightcove App Within Your Entry

    To use the Brightcove app within an entry of your stack, follow the steps given below:

    1. Go to your stack, click the Content Models icon in the left navigation panel, and click the + New Content Type button.
    2. Create a content type by adding relevant details as displayed below:
      Click to enlarge

    3. There are two ways to use the Brightcove app in your entry:

      1. Custom Field
      2. JSON Rich Text Editor Field

    Steps to Use the Brightcove App as a Custom Field

    1. In the Content Type Builder page, add a Custom field in your content type by clicking the Insert a field link represented by a + sign.
    2. Under Select Extension or App, select Brightcove, and click the Proceed button.
      Click to enlarge

      This adds Brightcove in the custom field.

      Click to enlarge
    3. Under Advanced properties, you can set the maximum number of assets that can be added in the Custom field. In our example, it is 5.
      {
        "advanced": {
           "max_limit":5
        }
}
    4. After adding the app in a custom field, click Save or Save and Close to save your changes.
    5. To use the Brightcove app, create an entry for this content type. In the left navigation panel, navigate to the Entries page, click + New Entry to create a new entry for the above content type, and then click Proceed.

      You can see the Brightcove app’s custom field on your entry page, as shown below:

      Click to enlarge
    6. Click the + Choose Video(s) button.
      Click to enlarge
    7. Select the video(s) from your Brightcove selector page and click the Add Videos(s) button to add them to your entry.
      Click to enlarge

      Note You can add multiple videos in one go.

      You can filter and view videos grouped under Playlists in the Selector page. Select the desired Playlists and add the videos.

      Click to enlarge

      You can also filter videos using Folders in the Selector page. Choose the desired folder from Brightcove and add the videos.

      Click to enlarge

      You can also search for videos in the Brightcove selector page.

      Click to enlarge

      Hover over a video on the Brightcove selector page to see the View in Brightcove option and navigate directly to the Brightcove platform.

      Click to enlarge

    8. The videos you select get added to your entry in the thumbnail view.

      Click to enlarge

      If the video is deactivated in Brightcove, you can view an Inactive mark on the video.

      Click to enlarge

      To view the videos in the list view, select the List view option from the dropdown.

      Click to enlarge

      The videos you select get added to your entry in the list view.

      Click to enlarge
    9. Hover over the video to access these features:
      1. Click the Reorder icon to drag and reorder the video.
      2. Click the Open in Brightcove icon to open the video in the Brightcove platform.
      3. Click the Remove icon to delete the video.

      Thumbnail View

      Click to enlarge

      List View

      Click to enlarge
    10. After adding the video(s), Save and Publish your entry.

    Steps to Use the Brightcove App as a JSONRTE Plugin

    1. In the Content Type Builder page, add a JSON Rich Text Editor field in your content type by clicking the Insert a field link represented by a + sign.
    2. Under Select Plugin(s), select Brightcove, and then click Add Plugin(s).
      Click to enlarge

      This adds Brightcove in the JSON Rich Text Editor field.

      Click to enlarge
    3. After adding the app in a JSON Rich Text Editor field, click Save or Save and Close to save your changes.
    4. To use the Brightcove app, create an entry for this content type. In the left navigation panel, navigate to the Entries page, click + New Entry to create a new entry for the above content type, and then click Proceed.

      You can see the Brightcove JSON Rich Text Editor field on your entry page, as shown below:

      Click to enlarge
    5. Click the Brightcove app button.
      Click to enlarge
    6. Select the video(s) from your Brightcove selector page and click the Add Videos(s) button to add them to your entry.
      Click to enlarge

      Note You can add multiple videos in one go.

      You can filter and view videos grouped under Playlists in the Selector page. Select the desired Playlists and add the videos.

      Click to enlarge

      You can also filter videos using Folders in the Selector page. Choose the desired folder from Brightcove and add the videos.

      Click to enlarge

      You can also search for videos in the Brightcove selector page.

      Click to enlarge

      Hover over the video on the Brightcove selector page to see the View in Brightcove option and navigate directly to the Brightcove platform.

      Click to enlarge

      The videos you selected are referenced within your entry:

      Click to enlarge
    7. To resize the video, drag the corner and adjust the size as required. Hover over the video to access these features:
      1. Click the Preview icon to preview the video in the Brightcove platform.
      2. Click the Edit icon to edit the video.
      3. Click the Remove icon to delete the video.
      Click to enlarge

      In the Edit Asset modal, you can view the Embed Link field.

      Note Previously, Embed Links were stored using the key link, which conflicted with Brightcove's Related Link feature that also used link. To avoid this conflict, embed links are now stored under embedLink and referenced via redactor_attributes.anchorLink. Entries using the old link key will continue to display correctly.

      Click to enlarge

      Additional Resource: You can use alignment and inline asset features to edit the asset placement within the JSON Rich Text Editor field.

    8. After adding the video(s), Save and Publish your entry.