support Contact Support | system status System Status
Page Contents

    Salesforce Commerce Cloud User Guide

    This document provides step-by-step instructions for using Brightcove Salesforce Commerce Cloud Custom Cartridge to upload video files to the Brightcove Cloud/server and publish these files on the storefront (product details page, category landing page, product listing page, etc.) as needed.

    Multiple Language Support

    The extension provides multiple UI language support for Business Manager Interface. Note: This version of the extension has support for English and French for UI Language.

    Organization Profile
    Organization Profile
    Business Manager - English
    Business Manager - English
    Business Manager - French
    Business Manager - French

    Add Video

    Below are the steps for adding videos.

    1. Navigate to Merchant Tools -> Brightcove -> Add Video
    2. Select Language from the menu (the default will the default locale selected for the site):
      Video Language Selector
      Video Language Selector
    3. Click the select option next to Video field.
    4. In the dialog that appears, select the video file:
      Select Video Dialog
      Select Video Dialog
    5. Click the select option next to Thumbnail field, and a similar popup dialog will appear where you can select the thumbnail file.
    6. Click the select option next to Poster field, and a similar popup dialog will appear where you can select the poster file.
    7. Submit the form to initiate the ingestion process:
      Submit Video Ingest Form
      Submit Video Ingest Form
    8. Validate the success message on the form after submission:
      Validate Video Ingest Success
      Validate Video Ingest Success
    9. You can verify that in the video was ingested successfully by logging into Brightcove Studio and navigating to the Media module:
      View Video in Studio
      View Video in Studio
    10. You can also click on the video to reveal the details in order to verify the locale code:
      Verify Locale Code
      Verify Locale Code

    Assign Videos - Categories

    First we will look at the steps for assigning videos to categories.

    Assign Videos to Categories

    1. Navigate to Merchant Tools -> Brightcove -> Assign Video (Categories).
    2. Videos are assigned to locales.
      • Locale related data can be viewed by changing the locale from the dropdown:
        Locale Menu - English
        Locale Menu - English

        Note that the only locales currently supported are English (United States) and francais (France)

        Locale Menu - French
        Locale Menu - French
      • Video thumbnails can be viewed by hovering the cursor on Video ID:
        View Video Thumbnail
        View Video Thumbnail
    3. Click Assign Video option to assign one or more videos.
    4. Already assigned videos will appear as selected on the assign video grid:
      Assigned Videos
      Assigned Videos
    5. Assigned slot cannot be used for the other videos for same locale:
      Assigned Video Slots
      Assigned Video Slots
    6. Players and slots can be changed by using the respective dropdowns available in each video tile.
    7. Select another video with the different slot.
    8. Click the Save Video button to assign the selected videos:
      Save Video Assignment
      Save Video Assignment
    9. Verify the assigned video and the slot:
      Verify Video Assignment
      Verify Video Assignment
    10. Verify the data in category object.
    11. Navigate to Merchant Tools -> Catalogs.
    12. Select the catalog.
    13. Select the category/sub-category.
    14. Select Edit.
    15. Select Category Attributes.
    16. Scroll down to the Brightcove section:
      Brightcove Category Attributes
      Brightcove Category Attributes
    17. To assign videos to subcategories, click on the category:
      Select Category
      Select Category
    18. The subcategories list will appear:
      Subcategories List
      Subcategories List
    19. Follow steps 3-16 to assign videos to subcategories.

    Assign videos to Master Products

    1. Navigate to Merchant Tools -> Brightcove -> Assign Video (Products).
    2. Videos are assigned to locales.
      • Locale related data can be viewed by changing the locale from the dropdown:
        Locale Menu - English
        Locale Menu - English

        Note that the only locales currently supported are English (United States) and francais (France)

        Locale Menu - French
        Locale Menu - French
      • Video thumbnails can be viewed by hovering the cursor on Video ID:
        View Video Thumbnail
        View Video Thumbnail
    3. Click Assign Video option to assign one or more videos.
    4. Already assigned videos will appear as selected on the assign video grid:
      Assigned Videos
      Assigned Videos
    5. Assigned slot cannot be used for the other videos for same locale:
      Assigned Video Slots
      Assigned Video Slots
    6. Players and slots can be changed by using the respective dropdowns available in each video tile.
    7. Select another video with the different slot.
    8. Click the Save Video button to assign the selected videos:
      Save Video Assignment
      Save Video Assignment
    9. Verify the assigned video and the slot.
      Verify Video Assignment
      Verify Video Assignment
    10. Verify the data in category object.
    11. Navigate to Merchant Tools -> Products.
    12. Search the product ID.
    13. Select the product.
    14. Select General.
    15. Scroll down to the Brightcove section:
      Product Details Brightcove Section
      Product Details Brightcove Section

    Assign videos to Variant Products

    1. Navigate to Merchant Tools -> Brightcove -> Assign Video (Products).
    2. Click on the Product ID
    3. A list of variants for the selected master will appear:
      Product Variants List
      Product Variants List
    4. Videos are assigned to locales.
      • Locale related data can be viewed by changing the locale from the dropdown:
        Locale Menu - English
        Locale Menu - English

        Note that the only locales currently supported are English (United States) and francais (France)

        Locale Menu - French
        Locale Menu - French
      • Video thumbnails can be viewed by hovering the cursor on Video ID:
        View Video Thumbnail
        View Video Thumbnail
    5. Click Assign Video option to assign one or more videos.
    6. Already assigned videos will appear as selected on the assign video grid:
      Assigned Videos
      Assigned Videos
    7. Assigned slot cannot be used for the other videos for same locale:
      Assigned Video Slots
      Assigned Video Slots
    8. Players and slots can be changed by using the respective dropdowns available in each video tile.
    9. Select another video with the different slot.
    10. Click the Save Video button to assign the selected videos:
      Save Video Assignment
      Save Video Assignment
    11. Verify the assigned video and the slot.
      Verify Video Assignment
      Verify Video Assignment
    12. Verify the data in category object.
    13. Navigate to Merchant Tools -> Products.
    14. Search the product ID.
    15. Select the product.
    16. Select General.
    17. Scroll down to the Brightcove section:
      Product Details Brightcove Section
      Product Details Brightcove Section
    18. We can get a list of all the Variants assigned to the catalog for the Site.
    19. Navigate to Merchant Tools -> Brightcove -> Assign Video (Products).
    20. Select Variant Products
      Variant Products
      Variant Products
    21. Follow the steps from 5 to 17.

    Embed Video

    The embed video steps allow you to get code to render videos on any ISML page.

    1. Navigate to Merchant Tools -> Brightcove -> Embed Video.
    2. Select the video and player you want and click Get Code:
      Embed Video
      Embed Video
    3. A popup dialog will appear with the code - select the code block, and it will be copied to the clipboard:
      Embed Code
      Embed Code
    4. Paste the code in content asset, content slot or in any ISML template to render video.

    Bulk upload

    Bulk upload allows to ingest videos in bulk quantity by uploading .csv files. The job will process the .csv file(s) and ingest the videos to the Brightcove account. A sample bulkUpload file is attached in the zip file under meta directory.

    1. Navigate to Merchant Tools -> Brightcove -> Bulk Upload.
    2. Select .csv file.
    3. Click submit:
      Bulk Upload
      Bulk Upload
    4. Navigate to Administration -> Jobs.
    5. Select Bulk-Upload job and click Run.
    6. Verify the job completion status.
      Verify Bulk Upload Completion
      Verify Bulk Upload Completion
    7. Verify the video object in Brightcove account.
      Verify Video Object in Brightcove
      Verify Video Object in Brightcove
    8. The file processed by Bulk-Upload job will be moved to bulkUpload_processed folder under Temp directory.
      Processed Bulk Upload File
      Processed Bulk Upload File

    Bulk assign

    Bulk assign allows to assign video(s) to categories, sub-categories and products in bulk quantity by uploading .csv file(s). Bulk assign allows to assign video(s) to categories, sub-categories and products in bulk quantity by uploading .csv file(s). The sample bulkAssign file(s) for category and product are attached in the zip file under the meta directory.

    The category file data looks like this:

    Bulk Assign Data Sample - Category
    Bulk Assign Data Sample - Category

    The product file data looks like this:

    Bulk Assign Data Sample - Product
    Bulk Assign Data Sample - Product

    The job will process csv file(s) for category and product under the same execution. The job checks the directories for product and category and process the file(s).

    Category

    1. Navigate to Merchant Tools -> Brightcove -> Bulk Assign.
    2. Select Category.
    3. Select .csv file.
    4. Click Submit:
      Submit CSV File - Category
      Submit CSV File - Category
    5. The file will upload in the Temp directory under the bulkAssignCategory folder.
      bulkassigncategory Folder
      bulkassigncategory Folder
    6. Navigate to Administration -> Jobs.
    7. Select the Bulk-Assign job and click Run.
    8. Verify the job completion status.
      Job Completion Status - Bulk Assign Category
      Job Completion Status - Bulk Assign Category
    9. Verify the video(s) assigned.
      Verify Videos Assign - Category
      Verify Videos Assign - Category
    10. The file processed by Bulk-Assign job will be moved to the bulkAssignCategory_processed folder under the Temp directory.

    Product

    1. Navigate to Merchant Tools -> Brightcove -> Bulk Assign.
    2. Select Product.
    3. Select .csv file.
    4. Click Submit:
      Submit CSV File - Product
      Submit CSV File - Product
    5. The file will upload in the Temp directory under the bulkAssignProduct folder.
      bulkassignProduct Folder
      bulkassignProduct Folder
    6. Navigate to Administration -> Jobs.
    7. Select the Bulk-Assign job and click Run.
    8. Verify the job completion status.
      Job Completion Status - Bulk Assign Product
      Job Completion Status - Bulk Assign Product
    9. Verify the video(s) assigned.
      Verify Videos Assign - Product
      Verify Videos Assign - Product
    10. The file processed by Bulk-Assign job will be moved to the bulkAssignProduct_processed folder under the Temp directory.

    Sample implementations

    Below are some pages for a sample implementation of Brightcove videos.

    Storefront Reference Architecture (SFRA)

    Category (catlanding, searchResultsNoDecorator)

    Category Sample
    Category Sample
    Category Sample Detail
    Category Sample Detail

    Product Page (productDetails)

    Product Sample 1
    Product Sample 1
    Product Sample 2
    Product Sample 2

    SiteGenesis Architecture

    Category Page (catlanding, categoryproducthits)

    Category Landing Page
    Category Landing Page
    Category Detail Page
    Category Detail Page

    Product Pages (productcontent, producttopcontent)

    Product Page Sample
    Product Page Sample
    Product Page Sample
    Product Page Sample

    Page last updated on 22 Jun 2020