Overview

Skill Level: Beginner

You can now use the Watson Content Hub Palette in delivery mode. By using the Palette in delivery mode, you can now select content and assets without authentication. The palette in the delivery mode returns only the published assets and content. This tutorial shows you how to launch the Watson Content Hub Palette in delivery mode in your application.

Prerequisites

You must have a Watson Content Hub tenant from which you want to select Content or Assets. If you do not already have a Watson Content Hub tenant, you can sign up for free here: https://www.ibm.com/uk-en/marketplace/cloud-cms-solution

Step-by-step

  1. Determine the API URL of your tenant

    The client must specify the API URL when the Palette is launched. The tenant API URL is added as the apiUrl query parameter. For example:

    https://www.digitalexperience.ibm.com/content-picker/picker.html?apiUrl=https://my2.digitalexperience.ibm.com/api/7b68b4ce-fb1c-4f33-bc5c-8b7881662107

    Obtain the API URL from the ‘Hub information’ dialog in the WCH UI:

    Accessing your Watson Content Hub Information

    Watson Content Hub Information

  2. Handling CORS

    • The Delivery Palette is only accessible through the Authoring host  https://www.digitalexperience.ibm.com/content-picker/picker.html .
    • Therefore, API requests are issued from the ‘www’ Authoring host, but are made to the ‘myN’ Delivery host. Requests to the ‘myN’ Delivery host from other domains are blocked by default and you encounter a CORS exception. CORS, or Cross-Origin Resource Sharing is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served.
    • Therefore, it is necessary to add the ‘www’ Authoring host as a trusted domain for your tenant:

    Enabling CORS for your tenant

  3. Access the Delivery Palette

    Now that you know your API URL and enabled CORS for your tenant you can access the WCH Palette in delivery mode at the URL determined in step one:

    https://www.digitalexperience.ibm.com/content-picker/picker.html?apiUrl=https://my2.digitalexperience.ibm.com/api/7b68b4ce-fb1c-4f33-bc5c-8b7881662107

     

    You can add further query parameters to launch the Palette in other modes too. For example:

     1.     Launch the Delivery Palette for Content Items only:

    https://www.digitalexperience.ibm.com/content-picker/picker.html?apiUrl=https://my2.digitalexperience.ibm.com/api/7b68b4ce-fb1c-4f33-bc5c-8b7881662107&fq=classification:content

     2.     Launch the Delivery Palette for Assets only:

    https://www.digitalexperience.ibm.com/content-picker/picker.html?apiUrl=https://my2.digitalexperience.ibm.com/api/7b68b4ce-fb1c-4f33-bc5c-8b7881662107&fq=classification:asset

     3.     Launch the Delivery Palette for Image Assets only:

    https://www.digitalexperience.ibm.com/content-picker/picker.html?apiUrl=https://my2.digitalexperience.ibm.com/api/7b68b4ce-fb1c-4f33-bc5c-8b7881662107&fq=classification:asset&fq=assetType:image

     4.     Launch the Delivery Palette for Image Assets tagged with ‘nature’ only:

    https://www.digitalexperience.ibm.com/content-picker/picker.html?apiUrl=https://my2.digitalexperience.ibm.com/api/7b68b4ce-fb1c-4f33-bc5c-8b7881662107&fq=classification:asset&fq=assetType:image&fq=tags:nature

     

    Image Assets Tagged With Nature

  4. Accessing the WCH Palette sample page for your tenant

    You can access the Delivery Palette through the Sample page: https://www.digitalexperience.ibm.com/content-picker/samples/pickerConsumer.html

    Note: The sample page also includes Authoring launch modes that require you to be logged in to WCH and have the WCH cookies – the delivery options are unauthenticated.

     

    WCH Palette Sample Page

Expected outcome

You can now access all of the Content and Assets from your Watson Content Hub tenant using the Watson Content Hub Palette.

Join The Discussion

Your email address will not be published. Required fields are marked *