Registering custom traits for targeting

You can display a different variation of your page for different segments of your audience. Each segment is described by a set of “traits” — for example, age, gender, etc. You can use these traits in the Studio to build segments that you want to target.

You have full freedom to define and create the traits that you want to use, based on what you know about your users. But before you can use them, you need to first register the traits so that Plasmic Studio knows what traits can be used.

Registering traits

First, make sure you have set up app hosting.

Then, use registerTrait(), following these examples (using Next.js as an example):

import { initPlasmicLoader } from '@plasmicapp/loader-nextjs';
import config from './config.json';

export const PLASMIC = initPlasmicLoader(config);

// Register a trait called age that has type 'number'.
PLASMIC.registerTrait('age', {
  type: 'number',
  label: 'Age'
});

// Register a trait called color that has "blue", "red", "yellow"
// as options
PLASMIC.registerTrait('color', {
  type: 'choice',
  label: 'Color',
  options: ['blue', 'red', 'yellow']
});

// Register a trait called isLoggedIn that has type 'boolean'.
PLASMIC.registerTrait('isLoggedIn', {
  type: 'boolean',
  label: 'Is user logged in'
});

// Register a trait called utm_campaign that has type 'text'.
PLASMIC.registerTrait('utm_campaign', {
  type: 'text',
  label: 'UTM Campaign'
});

Note that the values for these traits for a specific visitor must be provided by your code when the page is rendered. So if the page is rendered on the server (either dynamically via SSR, or via a middleware rewrite), you must be able to obtain the traits for your visitor from the server request.

registerTrait API

registerTrait(name, meta) is called with the identifying name of the trait, plus some metadata. The metadata is an object with the following fields:

Have feedback on this page? Let us know on our forum.