Braze

The Braze App allows marketers to directly sync approved content from Contentful into Braze campaigns. This eliminates the need for manually creating Braze Connected Content, reducing the risk of errors and ensuring that updates to content are propagated to campaigns automatically.

Overview

The app provides the following features:

• A sidebar app to generate the Connected Content call, which can then be copied and pasted into Braze.

• Liquid tags to reference data imported by the call.

• JSON data for the call.

Requirements

• You must have Space Admin access to the Contentful space where you are installing the app.

• The Contentful API key to access to the Content Delivery API.
  
  NOTE: If needed, you can also create a new API key from the API keys menu in settings. You have to provide the Content Delivery API  access token.

• A configured Braze account.

Usage

Step 1: Install the Braze app in the Contentful web app

To install the Braze app in the Contentful web app:

1. Log in to the Contentful web app.

2. Click Apps and select Marketplace.

3. Navigate to the Braze app and select it. The “App details” window is displayed.
   

   

4. Click Install. The “Manage app access” window is displayed.
   

   

5. Under Environments, select the environments in which you want to install the app.

6. Click Authorize access. The configuration window is displayed.

7. Under “Configuration”, enter the value in the following field:
   - Contentful API key — Enter the Contentful API key that Braze will use to request your content via API at send time.
   

   

8. Click Install to selected environments. The Braze app is now installed in the selected environments and fields.

NOTE: If the following error message is displayed, check to make sure your API key has read access to the CDA: A valid Contentful API key is required.

Step 2: Add Braze to a content type

Once you have the app installed, you can add Braze to any content type as long as you still have a field available: 

1. Open the Contentful web app.

2. Navigate to the “Content model" tab. 

3. Select an existing content type or add a new one. The content type editor is displayed.

4. Scroll to the “Sidebar” section, and add Braze from the available items.
   

   

5. Click Save.

Step 3: Use the app

Once you have successfully configured the app in the content type sidebar, create a new entry using the content type you configured in Step 2.

To create a new entry using the configured content type: 

1. Navigate to the “Content" tab. 

2. Click Add Entry and select the content type. The entry editor is displayed.

3. Populate the fields and publish your content.

4. In the sidebar, click Generate Braze Connected Content to connect your content to Braze. 

5. Select the fields you want to include in your Connected Content call. 

6. Click Next.

7. Optional: If you have more than one locale, you will need to select the locales you want to reference in Braze messages, and click Next.

8. Finally, you can see and copy:

   1. The Braze Connected Content call with the selected fields.

   2. The liquid tags to reference those fields.

   3. The JSON data available in Braze via Connected Content.
      

Notes:

• If the entry contains any empty fields, the app will not generate Liquid tags for those fields.

• To view content information when using the Liquid tag in Braze, your entry must be published.

Liquid Tags

Localization

Entry fields can be localized, which means that you can have different languages. In consequence, the liquid tag generated can vary depending on which locales you choose. 

For example, suppose you have an entry of a blogPost content type, with a Short Text field with the body ID and two locales available (en-US and es-AR). If you select both of them in the Braze app, the liquid tags generated will be the following:

{{response.data.enUS.body}}

{{response.data.esAR.body}}

If the entry is not localized (no locale was selected for any field), the app will use the content type for creating the liquid tags . For example:
{{response.data.blogPost.body}}

For more information about localization, see the Localization page.

Special Field Types

There are different ways to handle lists and some Contentful types with liquidTags. When generating them, the app will choose one by default, but it is important to note that this may not be the most convenient for every user. This section will show you examples of other possible ways to handle those cases.

NOTE:  All the Liquid code shown below is for example purposes. You have to adapt it to your own context. In addition, we assume entries are not localized. For localized entries, see the Liquid Tags and Localization section. 

For more information on how to use Liquid tags in Braze, see the official Braze documentation.

Short text - List

Let’s say you have a content type called recipe, which includes a Short Text field configured as a List with the ID ingredients.

1. By default the liquid tags generated for this type of field is the following:
   

   Braze liquid tag for special field type

   {% for ingredientsItem in response.data.recipe.ingredients %} {{ingredientsItem}} {% endfor %}

   Copy

   
   When used in Braze this liquid tag displays each element value of the text  list.

2. You can also use the Liquid tag in its raw form:
   

   {{response.data.recipe.ingredients}}

   This option displays all the elements within the list without commas in Braze.

3. Finally, we can also use the list to access a specific element through its index:
   {{response.data.recipe.ingredients[0]}}

   This option displays only the element specified by the index in Braze.

Location

Let’s say you have a content type called venue, which includes a Location field with the ID address.

By default the liquids tags generated for this type of field are the following:

This option displays the latitude or longitude specific values.

You can also use the Liquid tag in its raw form:
{{response.data.venue.adress}}

This one displays a Ruby hash structure pair containing all the fields of the location field. Example output:

{"lat"=>50, "lon"=>9}

Media - One file

Let’s say you have a content type called blogPost, which includes a Media field with the ID image. By default the liquids tags generated for this type of field are title, description and url, like this:

But you can also access other fields for assets if you need them. The fields accessible for assets are:

• title

• description

• url

• contentType

• fileName

• size

• width

• height

Example for all of the fields:

You can also use the Liquid tag in its raw form:

{{response.data.blogPost.image}}

This one displays a Ruby hash containing all the fields of the asset field.

Media - Many files

Let’s say you have a content type called blogPost, which includes a Media field configured to allow multiple files. This is also referred to as a list of assets. The field ID is images.

1. By default the liquid tags generated for this type of field is the following:
   

   Liquid tag for images

   {% for imagesCollectionItem in response.data.blogPost.imagesCollection.items %} {{imagesCollectionItem.title}} {{imagesCollectionItem.url}} {{imagesCollectionItem.size}} {% endfor %}

   Copy

   
   When used in Braze this liquid tag displays for each element the values of the title, url and size.
   NOTE: If the value is empty, nothing will be displayed in Braze.

2. You can also use the Liquid tag in its raw form: {{response.data.blogPost.imagesCollection.items}}.
   This option displays a Ruby hash structure containing all the values of that assets list field. Example:
   

   Ruby hash - liquid tag

   {"title"=>"logo", "description"=>"A logo", "url"=>"https://url.com/logo.jpeg", "contentType"=>"image/jpeg", "fileName"=>"logo.jpg", "size"=>14267, "width"=>300, "height"=>225}{"title"=>"another logo", "description"=>"Another logo", "url"=>"https://url/anotherLogo.jpg", "contentType"=>"image/jpeg", "fileName"=>"anotherLogo.jpg", "size"=>14267, "width"=>300, "height"=>225}

   Copy

3. Finally, we can also use the list to access a specific element and field through its index:
   

   Liquid tag for Braze: list to access all files

   {{response.data.blogPost.imagesCollection.items[0].title}} {{response.data.blogPost.imagesCollection.items[0].description}} {{response.data.blogPost.imagesCollection.items[1].url}}

   Copy

   
   This option displays only the element specified by the index in Braze.

The Braze app generates liquid tags for title, description and URL, but you can also access:

• contentType

• fileName

• size

• width

• height
  

References - Many

Let’s say you have a content type called event, which includes a Reference field configured to allow multiple references. The field ID is contactList. 

1. By default the liquid tags generated for this type of field are the following:
   This option displays the value of the specified element property based on the index.

   
   NOTE: Each element from the reference list can have different content types.This means they can have different fields per element.
   

   Liquid tag for References - Many

   {{response.data.event.contactListCollection.items[0].name}} {{response.data.event.contactListCollection.items[0].phone}} {{response.data.event.contactListCollection.items[1].name}} {{response.data.event.contactListCollection.items[1].age}}

   Copy

2. Another option is to handle the liquid tag directly, for example: {{response.data.event.contactListCollection}}.
   When using the Liquid tag this way, Braze displays a Ruby hash structure containing all the elements of the list. This could be useful if you want to see all the elements and values available inside the reference list.
   Example:
   {"items"=>[{"name"=>"laura", "phone"=>"123567456"}, {"name"=>"charlie", "age"=>"23"}]}

3. You can also generate liquid tags for each element of the reference list and return it its raw form:
   

   Liquid tags for each event

   {% for event in response.data.event.contactListCollection.items %} {{event}} {% endfor %}

   Copy

   This option displays a Ruby hash structure for each reference that contains all the fields of that specific element.
   Example:
   {"name"=>"laura", "phone"=>"123567456"} {"name"=>"charlie", "age"=>"23"}

4. If you are sure that all the elements from the reference list have the same content type, you can use the for to handle the fields within the reference as well:
   

   Liquid tag: all elements of the content type

   {% for event in response.data.event.contactListCollection.items %} {{contactListCollection.name}} {{contactListCollection.phone}} {% endfor %}

   Copy

   This option displays the name and phone value of each element of the reference list.
   

NOTE: If an element from the reference list does not have the same content type, it can lead to errors or empty values in Braze.