Customize Content Cards
This article provides a breakdown in the different customization options available as part of your Content Card implementation. For technical details, visit our developer documentation for Android, iOS, or Web.
Customizing Content Cards and the feed they are located in can’t be done during the campaign creation process—you must work with your engineers and developers to build and customize your cards.
Customization approaches
Content Cards are fully customizable! At Braze, we break down customization into three different approaches based on the associated effort and level of flexibility provided. These approaches are referred to as “crawl”, “walk”, or “run”.
- Crawl: Take advantage of Braze’s basic Content Card styling options for a quick, low-effort implementation.
- Walk: Add some custom styling to the default Content Cards to better match your brand experience.
- Run: Customize every part of your Content Card campaigns, from style to behavior to cross-channel connections.
Best suited for teams with limited developer resources, the Crawl approach relies solely on Content Card templates to get you up and running with Content Cards with less than five lines of code.
With this approach, customization is in the hands of marketers, who determine the content, audience, and timing of each Content Card directly in Braze. Some light development work is needed upfront to decide where Content Cards will appear in your app or website, and styling options are limited.
Customization | Description |
---|---|
Effort | Low |
Card style | Choose from three Braze templates. |
Card behavior | Choose from three on-click behavior options. |
Card order | Newer Content Cards appear toward the top of the feed. Pinned cards stay at the very top. |
Analytics tracking | Content Card analytics are captured in Braze. |
Key-value pairs | Optional, powers additional UI/UX customization. |
The Braze SDK table view displays the default Content Card experience. If you want your Content Cards to blend into your app or site within any location, or need additional functionality not mentioned in this section, consider a Walk or Run approach instead.
A hybrid approach to implementation, the Walk approach involves both marketing and developer teams pitching in to match your app or site’s branding.
During the implementation process, developers write custom code to match the look and feel of Content Cards to that of your brand. This includes font type, font size, rounded corners, and colors. This approach still uses the default Content Cards, however, template styling is handled programmatically by your developers.
Marketers still maintain control of the audience, content, on-click behavior, expiration, and pinning directly in the Braze dashboard.
Customization | Description |
---|---|
Effort | Low |
Card style | Choose from three Braze templates or use your own developer-created templates. |
Card behavior | Choose from three on-click behavior options. |
Card order | Newer Content Cards appear toward the top of the feed. Pinned cards stay at the very top. |
Analytics tracking | Content card analytics are captured in Braze. |
Key-value pairs | Optional, powers additional UI/UX customization. |
With the Run approach, developers take the lead with full control of the Content Card user experience. Custom code dictates what the cards will look like, how they behave, and how they interact with other messaging channels (e.g., triggering a Content Card based on a push notification).
The Braze SDK does not handle the on-click behavior, order, or analytics. These traits must be handled programmatically by the developer for marketers to access valuable Content Card metrics in the Braze dashboard—like impressions, clicks, and dismissals.
Customization | Description |
---|---|
Effort | Depends on use case. |
Card style | Custom |
Card behavior | Custom |
Card order | Custom |
Analytics tracking | Custom |
Key-value pairs | Required |
Use cases
- Multiple Content Card feeds, such as adding a newsfeed, notification center, or promotions tab.
- Display Content Cards in an existing feed.
- Display Content Cards in a carousel view.
- Use a Content Card to capture user information.
- Trigger Content Cards based on other messaging channels.
Change “empty feed” language
You can change the language that appears automatically in empty Content Card feeds by redefining the localizable content card strings in your app’s localizable strings file:
1
2
3
4
5
"Appboy.content-cards.no-card.text" = "No Cards!!!!";
"Appboy.content-cards.done-button.title" = "Done";
"Appboy.content-cards.no-card.text" = "We have no updates.\nCheck again later.";
"Appboy.content-cards.no-connection.title" = "Connection Error";
"Appboy.content-cards.no-connection.message" = "Cannot establish network connection.\nPlease try again later.";
If you want to update it for different languages, find the corresponding language in the Resources folder structure with the same string Appboy.content-cards.no-card.text
.