Custom Theming

You can customize the appearance of Pulsate's In App messages so they fit your brand. Colors are applied at runtime through the PULPulsateManager theming API.

🚧

Feed theming moved to the Campaign Builder (SDK 4.7.0+)

Since Pulsate SDK 4.7.0 the Feed is rendered as a Web Feed, so Feed theming is no longer configured from the app side. Instead, set the color of buttons and text in Feed posts in the Campaign Builder when creating campaigns. In App messages are still themed directly from the SDK, as shown below.

Applying a theme configuration

Build a PULThemeConfiguration, set the color fields you want to override, and apply it all at once:

import PULPulsate
import UIKit

guard let manager = PULPulsateFactory.getDefaultInstance() else { return }

let config = PULThemeConfiguration()
config.bigInAppOneButtonColor = .red
config.bigInAppOneButtonTextColor = .white
manager.applyThemeConfiguration(config)

Setting individual colors

You can also set colors one at a time with the dedicated setters:

manager.setSmallInAppMessageBackgroundColor(.systemBackground)
manager.setBigInAppHeaderColor(.systemBlue)
manager.setBigInAppMessageBackgroundColor(.systemBackground)
manager.setBigInAppOneButtonColor(.red)
manager.setBigInAppOneButtonTextColor(.white)
manager.setBigInAppTwoButtonColor(.clear)
manager.setBigInAppTwoButtonTextColor(.red)
manager.setBigInAppTwoButtonOutlineColor(.red)

Setting colors by key

To set a color by key — for example when driving theming from your own configuration — use a typed PULThemeKey or a string key:

// Typed key
manager.setCustomColorWithThemeKey(.bigInAppHeader, color: .red)

// String key
manager.setCustomColor(forKey: "pulsate_big_in_app_header_color", color: .red)

Call getThemeConfigurationKeys() to list the available color keys at runtime.

Resetting the theme

To revert every custom color back to the SDK defaults:

manager.resetThemeColors()

User avatar customization

By default the user avatar uses the user's initials when possible, falling back to an anonymous icon. You can disable initials so the avatar is always the anonymous icon, even when first and last name are set. Configure this at startup, for example in your AppDelegate's didFinishLaunchingWithOptions:

manager.useInitials(forUserAvatar: false)

Read the current preference with getUseInitialsForUserAvatar().

Next steps

• Language Localization