Agregar, eliminar y reordenar bloques de contenido

Se puede agregar un nuevo bloque de contenido seleccionando el ➕ azul que se muestra al pasar el cursor sobre, debajo o al costado de un paso cuando está en modo de paso; para cambiar al modo de paso, haga clic fuera del área de vista previa modal o haga clic en el paso en el que está trabajando en la barra builder inferior.
Los bloques de contenido se pueden reordenar colocando el cursor sobre un bloque de contenido que no se esté editando activamente y haciendo clic y arrastrándolo a la nueva ubicación deseada.
Se puede reordenar una fila entera arrastrando el controlador que aparece a la derecha de la fila y moviéndolo a la nueva posición.

Al hacer clic en un bloque, se mostrarán los controles para ese bloque.
El icono de copia creará una nueva copia del bloque que se seleccionó con el contenido y el estilo actuales.
El icono de la papelera eliminará el bloque seleccionado.

Tipos de pasos modales móviles

Los modales móviles tienen varios tipos de pasos que controlan cómo se muestra ese paso en el dispositivo móvil.

• Estándar : un modal con espacio visual en todos los lados del modal .
  
  Los modales estándar tienen un control de posición adicional que permite alinear la experiencia con la parte superior, central o inferior de la pantalla.
  
• Pantalla completa : un modal que cubre completamente toda el área visual de la pantalla.
  
• Media pantalla : un modal que está alineado en la parte inferior de la pantalla con el espacio visual en la parte superior de la pantalla.
  
• Hoja de portada : un modal que cubre la mayor parte de la pantalla con un espacio visual mínimo en la parte superior de la pantalla.
  
• Slideout - (compatible con SDK 3.1 y superiores) una experiencia discreta que tiene espacio visual en todos los lados y se puede ubicar en cualquier cuadrante principal de la pantalla.
  
  
  El patrón Slideout tiene una configuración de posición para especificar el cuadrante en la pantalla desde donde se mostrará y animará el Slideout.
  

Editar y dar estilo a los bloques de contenido

Para diseñar y editar bloques de contenido, haz clic en el bloque y la barra lateral del Constructor Móvil mostrará las opciones de estilo correspondientes. Dependiendo del bloque de contenido que estés ajustando, puedes seleccionar opciones de estilo como el color, el tamaño, el espaciado y el radio de las esquinas.

• Asistente Appcues : Esta opción, impulsada por OpenAI, es ideal si necesitas ayuda con tu redacción. Para obtener ayuda con la gestión de las funciones de IA en tu cuenta, contacta con support@appcues.com.
• Imagen/GIF : Puede subir una nueva imagen PNG, JPG, SVG o GIF. Para un mejor rendimiento, se recomiendan imágenes pequeñas optimizadas de menos de 2 MB y 1620x1620. Puede reutilizar las imágenes subidas previamente seleccionando la opción "Seleccionar de la galería de imágenes" al añadir una imagen.
• Texto : El menú desplegable de fuentes incluye las opciones predeterminadas iOS y Android. Puedes añadir una fuente personalizada haciendo clic en el botón "Añadir lista de fuentes personalizadas" al final del menú desplegable. Debes introducir el nombre exacto de la fuente deseada. Ten en cuenta que algunas fuentes personalizadas no se visualizarán en el builder móvil, así que te recomendamos usar la vista previa para ver exactamente cómo se verán en un dispositivo móvil. También puedes usar el debugger móvil (una vez instalado el SDK) para ver las fuentes disponibles en tu aplicación.
• Vídeo : agrega tus vídeos de servicios de vídeo comunes como YouTube, Wistia o Vimeo para incrustar vídeos en un modal .
• Emoji : Se puede seleccionar un emoji y añadirlo al modal . Los emojis que se muestran en el dispositivo usarán la biblioteca de emojis nativa.
• Icono con texto : Un bloque con un icono personalizable, junto con un título y texto personalizables. Se pueden subir nuevas imágenes y seleccionar las existentes de la galería.
• Encabezado : Un bloque con título, texto e imagen de fondo. Se pueden subir nuevas imágenes y seleccionar las existentes de la galería.
• Entrada de texto : un bloque de encuesta para respuestas de encuestas de texto abierto.
• Selección única : un bloque de encuesta de selección de radio donde los usuarios pueden seleccionar una única respuesta.
• Selección múltiple : un bloque de encuesta con casilla de verificación donde los usuarios pueden seleccionar varios elementos.
• Calificación : un bloque de encuesta con opciones de calificación en números, estrellas y emojis.
• Botón : Para editar el texto del botón, haz clic en él y escribe directamente. Puedes asignar varias acciones a un botón:
  • Ir a URL : Se muestra un campo de entrada para introducir un enlace URL. Este puede ser un enlace profundo (a otra pantalla de la aplicación) o un enlace del navegador web.
  • Siguiente paso : el botón se vinculará al siguiente paso en el flujo modal móvil.
  • Paso anterior : el botón se vinculará al paso anterior en el flujo modal móvil.
  • Desencadenar flujo : puede seleccionar un flujo móvil publicado de las opciones desplegables y, opcionalmente, puede especificar otra pantalla a la que ser redirigido antes de activar el nuevo flujo.
  • Descartar flujo : cuando se selecciona, puede elegir "Marcar flujo como completo" de forma predeterminada.
  • Ir al paso personalizado : aparecerá un menú desplegable adicional en el que el usuario puede seleccionar cualquiera de los pasos del flujo.
    
    

modals de estilo

• Las opciones de estilo modal aparecen en la barra lateral derecha. Si ha hecho clic en un bloque de contenido, simplemente haga clic fuera del modal en el panel de vista previa para completar las opciones de estilo modal :
  • Posición : Disponible solo para el tipo modal estándar. Esta opción define la posición vertical del modal (SDK v1.3+).
  • Cerrar modal : puede seleccionar la funcionalidad de salida "X" que se encuentra en la esquina superior derecha del modal o seleccionar "ninguno", lo que requiere que se incluya un botón de acción "cerrar" explícito en el contenido del modal .
  • Color modal : seleccione de la rueda de colores o ingrese un código de color hexadecimal para ajustar el color modal .
  • Color y grosor del borde : Disponible solo para el tipo modal estándar. Seleccione de la paleta de colores o introduzca un código de color hexadecimal para ajustar el color y un número para ajustar el grosor del borde.
  • Fondo : agrega una imagen de fondo para todo el modal .
  • Indicador de paso : muestra, oculta y personaliza los indicadores de paso en la parte inferior de un modal .
  • Radio de la esquina : ajuste el control deslizante o ingrese un número para ajustar el radio de la esquina del modal .
  • Espaciado : ingrese un número en la matriz de espaciado para ajustar el relleno en el modal .
  • Modo Oscuro : Seleccione el icono ☾ en la configuración de la vista previa o en la herramienta de selección de color. Al actualizar el color en este modo, se actualizará la configuración de color seleccionada para los usuarios que vean la experiencia con el modo oscuro activado. Si no se configura ningún color para el modo oscuro, el color predeterminado será el del modo claro. Esto se basa en la configuración general del dispositivo del usuario.

Configurar un bloque para que se adhiera a la parte superior o inferior de un modal

Compatible con SDK 1.3 y superiores.

Con la opción "Stick", puedes fijar un bloque o una fila de bloques en la parte superior o inferior de un modal . Esto hará que la fila permanezca fija, de modo que permanezca en la posición establecida incluso al desplazarse por otro contenido.
Para fijar una fila, seleccione cualquier bloque en la fila superior o inferior y haga clic en el pin fijo. Añadir un bloque a una fila fija lo fijará. Eliminar un bloque de una fila fija actualizará su comportamiento a la fila a la que se movió.

Para fijar una fila para que ya no quede fija, seleccione cualquier bloque en la fila y haga clic en el pin fijo.
Mover una fila fija a una nueva posición o mover una nueva fila a la posición de una fila fija también hará que esas filas ya no sean fijas.