Branded App by Wix: personalizar las funciones y el contenido de tu app

18 min de lectura
Una vez que hayas diseñado el tema de tu app de marca, personaliza el contenido y las funciones dentro de la app. Tu app de marca se compone de pantallas, que vienen a ser similares a las páginas de un sitio. Elige cuántas pantallas necesitas y qué muestra cada una de ellas.
Agrega elementos a las pantallas en función de tu negocio, como una página de producto de Wix Stores, una lista de eventos o un horario de clases de Wix Bookings. Luego, personaliza aún más la pantalla con botones, imágenes, videos y más.
Elige si deseas personalizar el contenido de tu app desde el editor web en el panel de control de tu sitio o desde la app Wix Owner en tu dispositivo móvil. 
Nota:
En la actualidad, no todas las opciones de personalización están disponibles en el editor web. Te recomendamos descargarte la app Wix Owner para acceder a las capacidades de personalización completas.
En este artículo, obtén más información sobre lo siguiente:

Personalizar el encabezado

El encabezado de tu app de marca se encuentra en la pantalla Inicio y es el primer elemento que ven los miembros después de iniciar sesión en tu app. Refleja estilo de tu negocio agregando tu logotipo, una foto de portada y un color de tema para hacer que los botones se destaquen.
App Wix Owner
  1. Ve a App móvil en el panel de control de tu sitio.
  2. Selecciona la pestaña de tu app de marca. Si ya le diste un nombre a tu app, el título de la pestaña será el nombre de tu app. Si no le has asignado un nombre a la app, el título de la pestaña dice "Tu propia app móvil".
  3. Selecciona Editar app móvil para abrir el editor web.
    Nota: Si aún no has diseñado tu app, debes elegir el nombre, el tema y el estilo de la app antes de ver la opción Editar app móvil.
  4. En el editor web, haz clic en el encabezado de tu app para abrir el panel Editar encabezado.
Captura de pantalla del panel Editar encabezado en el editor web del panel de control.
  1. Personaliza el diseño del encabezado con las opciones disponibles:
    • Nombre: actualiza el nombre de tu negocio o app.
    • Eslogan: agrega un eslogan personalizado (el eslogan de tu app o un anuncio corto).
    • Mostrar logo: haz clic en la palanca para mostrar u ocultar tu logotipo. Pasa el cursor sobre la imagen del logotipo para cambiarla o eliminarla.
    • Mostrar información general: haz clic en la palanca para mostrar un enlace en el encabezado que abre una pantalla con más información sobre tu negocio, incluidos enlaces a redes sociales, información de contacto y la URL del sitio.
    • Imagen de portada: haz clic en el icono Agregar imagen  para subir una imagen de portada. También puedes agregar varias fotos para crear una presentación de diapositivas por la que los miembros puedan desplazarse. Para las presentaciones de diapositivas, selecciona un retraso de transición (en segundos) entre las fotos.
  2. Haz clic en el menú desplegable Información de los miembros para elegir qué información del miembro deseas mostrar en el encabezado: 
    • Mostrar número de miembros: muestra u oculta el número de miembros en el encabezado de tu app.
    • Mostrar perfil de miembros: muestra u oculta los avatares del perfil del miembro en el encabezado de tu app.
  3. Haz clic en el menú desplegable Botones de acción para agregar botones al encabezado.
    • Mostrar botón de invitación: haz clic en la palanca para mostrar u ocultar un botón que permite a los miembros invitar a más personas a tu app de marca.
    • Mostrar botón personalizado: haz clic en la palanca para agregar un botón personalizado al encabezado. Por ejemplo, un botón Reservar ahora puede enviar a los miembros a la pestaña de reservas o citas.
  4. Haz clic en el menú desplegable Iconos de la barra superior para agregar iconos adicionales al encabezado. Según las apps de Wix que hayas instalado (por ejemplo, Wix Stores, Wix Chat), es posible que veas opciones de personalización adicionales, entre ellas:
    • Mostrar icono del carrito de compras: haz clic en la palanca para agregar un icono de carrito de compras al encabezado de modo que los miembros puedan navegar fácilmente a su carrito.
    • Mostrar icono del chat: haz clic en la palanca para agregar un icono de chat al encabezado que dirija a los miembros a chatear contigo.
  5. Pulsa Guardar en la parte superior derecha.

Personalizar el menú de navegación

La app de marca se compone de pantallas para ayudar a los miembros a navegar entre las diferentes áreas de tu app. Puedes elegir si el menú de navegación aparece en la parte superior o inferior de tu app. Luego, personaliza el diseño agregando iconos de menú personalizados.
App Wix Owner
  1. Ve a App móvil en el panel de control de tu sitio.
  2. Selecciona la pestaña de tu app de marca. Si ya le diste un nombre a tu app, el título de la pestaña será el nombre de tu app. Si no le has asignado un nombre a la app, el título de la pestaña dice "Tu propia app móvil".
  3. Selecciona Editar app móvil para abrir el editor web.
    Nota: Si aún no has diseñado tu app, debes elegir el nombre, el tema y el estilo de la app antes de ver la opción Editar app móvil.
  4. Selecciona la barra de navegación de la app. Aparece debajo del encabezado o en la parte inferior de la app.
Captura de pantalla del panel de navegación de la barra inferior en el editor web.
  1. Elige un estilo de navegación:
    • Barra de pestañas superior: los miembros navegan por las pantallas en la parte superior de la app, directamente debajo del encabezado.
    • Barra de pestañas inferior: los miembros navegan por las pantallas en la parte inferior de la app. Puedes agregar iconos personalizados para cada pantalla si seleccionas esta opción.
      • Etiquetas: haz clic en la palanca para mostrar u ocultar el nombre de la pantalla en el menú de navegación. El nombre aparece debajo del icono de la pantalla. Se recomienda incluir el nombre de pantalla por razones de accesibilidad.
      • Iconos: personaliza los iconos en el menú de navegación. Cada icono corresponde a una pantalla. Pasa el cursor sobre un icono y haz clic en Cambiar icono para reemplazarlo.
  2. Selecciona Guardar en la parte superior derecha.

Agregar elementos a las pantallas

Los elementos conforman el contenido de tu app. Agrega elementos para mostrar quién eres, qué haces y qué ofreces a los miembros de la app. Por ejemplo, si tienes un negocio de planificación de eventos, agrega un elemento de eventos para que las personas puedan confirmar su asistencia directamente desde la app.
Una vez que hayas agregado elementos a tu app, muévelos hacia arriba o hacia abajo en la misma pantalla o cámbialos a una pantalla completamente diferente. También puedes duplicar elementos, eliminar los no deseados y editar el contenido dentro de cada elemento.
Consejo:
Más información sobre cómo agregar elementos para negocios específicos como tiendas online, restaurantes y reservas.
App Wix Owner
  1. Ve a App móvil en el panel de control de tu sitio.
  2. Selecciona la pestaña de tu app de marca. Si ya le diste un nombre a tu app, el título de la pestaña será el nombre de tu app. Si no le has asignado un nombre a la app, el título de la pestaña dice "Tu propia app móvil".
  3. Selecciona Editar app móvil para abrir el editor web.
    Nota: Si aún no has diseñado tu app, debes elegir el nombre, el tema y el estilo de la app antes de ver la opción Editar app móvil.
  4. Haz clic en Elementos a la izquierda del editor web.
  5. Navega por el catálogo y haz clic en un elemento para agregarlo a tu app.
    Consejo: En Ítems básicos, puedes agregar elementos para diseñar y organizar tu app, como botones, imágenes, líneas separadoras y videos.
Captura de pantalla del catálogo de elementos en el editor web con un carrusel de eventos seleccionado.
  1. Haz clic en el elemento en la vista previa de la app para personalizar los ajustes de visualización y contenido.
Nota:
No todos los elementos se pueden personalizar desde el editor web, y es posible que deban actualizarse desde la app Wix Owner.
  1. (Opcional) Administra aún más el elemento con las opciones disponibles. Nota: Pueden aparecer diferentes opciones según el elemento que hayas agregado.
    • Visibilidad del elemento: elige si deseas mostrar el elemento en dispositivos Android, dispositivos iOS o ambos. Más información sobre cómo mostrar u ocultar elementos en diferentes sistemas operativos.
      1. Selecciona el elemento.
      2. En Visibilidad del elemento dentro del panel Editar, elige una opción: Todos, Android o iOS.
    • Reordenar un elemento:
      1. Selecciona el elemento.
      2. Haz clic en las flechas Mover arriba o Mover abajo junto al elemento para cambiarlo de posición en la pantalla.
    • Duplicar un elemento:
      1. Selecciona el elemento.
      2. Haz clic en el icono Duplicar . El nuevo elemento aparece sobre el elemento original.
    • Eliminar un elemento:
      1. Selecciona el elemento.
      2. Haz clic en el icono Eliminar  junto al elemento.
      3. Haz clic en Eliminar para confirmar.
  2. Pulsa Guardar en la parte superior derecha.
Captura de pantalla de un elemento con las opciones Reordenar duplicados y Eliminar seleccionadas.

Administrar las pantallas

Actualiza las pantallas de tu app, incluida la cantidad de pantallas que deseas mostrar en la barra de navegación, el orden de las pantallas y los nombres de las mismas. También puedes crear pantallas que estén ocultas del menú principal de tu app.
App Wix Owner
  1. Ve a App móvil en el panel de control de tu sitio.
  2. Selecciona la pestaña de tu app de marca. Si ya le diste un nombre a tu app, el título de la pestaña será el nombre de tu app. Si no le has asignado un nombre a la app, el título de la pestaña dice "Tu propia app móvil".
  3. Selecciona Editar app móvil para abrir el editor web.
    Nota: Si aún no has diseñado tu app, debes elegir el nombre, el tema y el estilo de la app antes de ver la opción Editar app móvil.
  4. Selecciona Pantallas a la izquierda del editor web.
  5. Elige lo que quieres hacer:
    • Agregar una nueva pantalla: elige si deseas agregar una pantalla que aparezca en la barra de navegación principal de tu app o una pantalla que esté oculta de la navegación.
      • Para agregar una pantalla en la barra de navegación:
        1. Haz clic en + Agregar junto a Se muestran en la navegación.
        2. Ingresa un nombre para la nueva pantalla.
        3. Arrastra la pantalla hacia arriba o hacia abajo a la ubicación donde debería aparecer en la barra de navegación. 
      • Para agregar una pantalla que no se muestre en la navegación:
        1. Haz clic en + Agregar junto a No se muestran en la navegación.
        2. Ingresa un nombre para la nueva pantalla.
        3. Haz clic en el icono de marca de verificación  para guardar el nombre de pantalla.
    • Establecer permisos para cada pantalla: establece permisos para cada pantalla para que solo aquellos miembros con insignias o planes de precios específicos puedan acceder a ellas. 
      1. Haz clic en el icono Más acciones  junto a la pantalla correspondiente.
      2. Haz clic en Establecer permisos.
      3. Elige quién puede acceder a esta pestaña: Todos los miembros, Miembros con insignias o Miembros con planes de precios
    • Eliminar una pantalla de navegación: oculta una pantalla de la barra de navegación. Cuando seleccionas esta opción, la pantalla se mueve a la sección No se muestran en la navegación.
      1. Haz clic en el icono Más acciones  junto a la pantalla correspondiente.
      2. Haz clic en Eliminar de la navegación.
        Consejo: Para volver a mostrarla, haz clic en el icono Más acciones  junto a la pantalla y haz clic en Agregar a la navegación.
    • Reordenar una pantalla:
      • Haz clic en la pantalla que deseas reordenar y arrástrala hacia arriba o hacia abajo en la barra de navegación.
    • Renombrar una pantalla:
      1. Haz clic en el icono Más acciones  junto a la pantalla correspondiente.
      2. Haz clic en Renombrar
      3. Ingresa un nuevo nombre de pantalla.
    • Eliminar una pantalla:
      1. Haz clic en el icono Más acciones  junto a una pantalla.
      2. Haz clic en Eliminar
      3. Haz clic en Eliminar para confirmar.
Captura de pantalla del menú Más acciones junto a una pantalla en la navegación.
  1. (Opcional) Administra las pantallas de presentación e inicio de sesión de tu app de marca. Más información sobre el diseño de cada pantalla.
    1. Pantalla de presentación: 
      1. Haz clic en Presentación debajo de Pantallas del sistema.
      2. Actualiza el color del fondo y la imagen de la pantalla de presentación.
        Nota: Los cambios en la pantalla de presentación de tu app se publicarán una vez que vuelvas a enviar tu app al App Store y Google Play.
    2. Pantalla de presentación: 
      1. Haz clic en Inicio de sesión debajo de Pantallas del sistema.
      2. Edita el texto de la pantalla, el color del fondo y la imagen de inicio de sesión.
  2. Pulsa Guardar en la parte superior derecha.

Preguntas frecuentes

Haz clic en una de las preguntas a continuación para obtener más información sobre cómo personalizar las funciones de tu app de marca. 

Video tutorial

¿Te ha sido útil?

|