Skip to main content

Enabling Optimize on an Existing Contentstack Stack

This guide will walk you through adding Uniform Optimize to an existing Contentstack stack as well as linking the Uniform Optimize Contentstack extension to your Uniform Optimize project.

Navigate to https://uniform.app/ and create an account if you have not already and accept the Terms of use and Privacy Policy.

./assets/Untitled.png

Provide a project name that will allow you to identify this project later. Select Create your first intent. This option bypasses the onboarding flow associated with creating a new starter site. This option will also allow the creation of intents for your existing site.

./assets/Untitled-1.png

Name and provide a description, optionally, for your first intent.

./assets/Untitled-2.png

Click on the project that you just created from the project list.

./assets/Untitled-3.png

The first intent that we created during onboarding should be visible when we click through to the project. We will create an API key that we will use to connect Contentstack to Uniform Optimize.

  • Click the Create an API key link near the Publish button.
  • Click the (+) button to create a new API key.
  • Give the key a descriptive name, such as 'Contentstack'
  • Add permissions to the project that you created previously.
  • Check off the Uniform Optimize > Read Drafts permission. This will let Contentstack read un-published intent data that it needs.
  • Click Create, and save the API key and project ID you are shown for later. If you forget the API key value, you will need to delete and re-create the key; it is only shown once.

Once the API Key is added, use the back button to return to your project, then click Publish to publish our first intent.

Contentstack Extension Installation#

In a new tab, open the Contentstack stack you want to enable Uniform Optimize. Next, we will add the Uniform Optimize extension - click the Settings icon in the top navigation, then click Extensions.

./assets/Untitled-5.png

On the Contentstack Extensions page, click Add Extension, then Create New.

./assets/Untitled-6.png

In the Select Extension Type dialog, select Custom Field.

./assets/Untitled-7.png

Provide a name for the extension in the Title field, e.g., "Intent Tags."

./assets/Untitled-8.png

Select JSON in the Field data type field.

./assets/Untitled-9.png

Select External Hosting in the Hosting method field.

./assets/Untitled-10.png

Enter https://uniformoptimize-contentstack.netlify.app in the External hosting URL field.

./assets/Untitled-11.png

In the Config Parameter field, enter the following:

{  "OPTIMIZE_API_KEY": "paste api key here",  "OPTIMIZE_PROJECT_ID": "paste project ID here",  "OPTIMIZE_FIELD_TYPE_ID": "unfrm_opt_intent_tag"}

NOTE: The OPTIMIZE_API_KEY value can be created and/or copied from the Uniform Optimize dashboard. The OPTIMIZE_PROJECT_ID can be found within Uniform Optimize on the project's General Settings at the bottom, or in the project's URL.

./assets/Untitled-12.png

Click Save to finish installation of the Uniform Optimize extension for Contentstack.

Contentstack Extension Usage#

Once the Contentstack Extension is installed, you can add fields to your content types that use the custom Intent Tags field provided by the extension.

Create a new content type or edit an existing content type — select Custom in the fields list.

./assets/Untitled-13.png

In the Edit Properties section, select Intent Tags in the Select Extension list.

./assets/Untitled-14.png

Enter a name for the field in the Unique ID field, e.g., unfrm_opt_intent_tag.

NOTE: The value you enter in the Unique ID field will be used by developers when referencing the field in application code.

./assets/Untitled-15.png

Next, enter a helpful display name for content editors in the Display Name field.

NOTE: The value you enter in the Display Name is what will be shown to content editors when editing within Contentstack.

./assets/Untitled-16.png

Click Save or Save and Close to finish adding the Uniform Optimize Intent Tags field to your content type.