Crear una plantilla de mensaje dentro de la aplicación

Usa Plantillas > Plantillas de mensajes dentro de la aplicación para crear una biblioteca reutilizable de diseños de mensajes dentro de la aplicación y en el explorador. Puedes guardar diseños del editor de arrastrar y soltar o crear activos de Perfil de color y Plantilla CSS para el editor tradicional.

Paso 1: Abre Plantillas de mensajes dentro de la aplicación

En el panel de Braze, ve a Plantillas > Plantillas de mensajes dentro de la aplicación.

Paso 2: Elige cómo crear una plantilla

La forma de añadir una plantilla depende de tu objetivo:

Paso 3: Administra tus plantillas

En Plantillas > Plantillas de mensajes dentro de la aplicación, filtra, busca o abre una plantilla para editarla. Puedes duplicar y archivar plantillas como cualquier otro tipo de plantilla. Para un resumen de los flujos de trabajo de plantillas y medios, consulta Plantillas.

Necesitas permiso para acceder a las plantillas. Por ejemplo, otorga “Acceso a Campaigns, Canvas, tarjetas, Content Blocks, conmutadores de características, Segments, biblioteca de medios, ubicaciones, códigos promocionales y centros de preferencias” o el permiso granular equivalente para ver o editar plantillas de mensajes dentro de la aplicación. Para más detalles, consulta Permisos de usuario.

Crear perfiles de color y plantillas CSS

Puedes editar plantillas existentes o seleccionar + Crear y elegir Perfil de color o Plantilla CSS para crear nuevas plantillas para tus mensajes dentro de la aplicación.

Perfil de color

Puedes personalizar la combinación de colores de tu plantilla de mensaje introduciendo un código de color HEX o seleccionando el cuadro de color y eligiendo un color con el selector de colores. Si quieres que este perfil se aplique de forma predeterminada cuando crees nuevos mensajes dentro de la aplicación en el editor tradicional, selecciona Usar como perfil predeterminado.

Selecciona Guardar perfil de color cuando hayas terminado.

Plantilla CSS

Puedes personalizar una plantilla CSS completa para tu mensaje dentro de la aplicación de tipo modal web.

Nombra y etiqueta tu plantilla CSS, luego elige si será tu plantilla predeterminada. Puedes escribir tu propio CSS en el espacio proporcionado. Este espacio ya está rellenado con el CSS que se muestra en la vista previa de tu mensaje, y puedes ajustarlo según tus necesidades.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
.ab-message-header, .ab-message-text {
  color: #333333;
  text-align: center;
}

.ab-message-header {
  font-size: 20px;
  font-weight: bold;
}

.ab-message-text {
  font-size: 14px;
  font-weight: normal;
}

.ab-close-button svg {
  fill: #9b9b9b;
}

.ab-message-button {
  border: 1px solid #1b78cf;
  font-size: 14px;
  font-weight: bold;
}
.ab-message-button:first-of-type {
  background-color: white;
  color: #1b78cf;
}
.ab-message-button:last-of-type, .ab-message-button:first-of-type:last-of-type {
  background-color: #1b78cf;
  color: white;
}

.ab-background {
  background-color: white;
}

.ab-icon {
  background-color: #0073d5;
  color: white;
}

.ab-page-blocker {
  background-color: rgba(51, 51, 51, .75);
}

Puedes editar todo, desde el color de fondo hasta el tamaño y peso de la fuente, y más.

Modal con CSS (solo web)

Si eliges usar un mensaje de tipo modal web solo para web con CSS, puedes aplicar tu propia plantilla o escribir tu propio CSS en el espacio proporcionado. Este espacio ya está rellenado con el CSS que se muestra en la vista previa de tu mensaje, pero puedes ajustarlo según tus necesidades.

Si eliges aplicar tu propia plantilla, selecciona Aplicar plantilla y elige de la galería de plantillas de mensajes dentro de la aplicación. Si no tienes ninguna opción, puedes añadir una plantilla CSS usando el constructor de plantillas CSS en Plantillas > Plantillas de mensajes dentro de la aplicación.