Empiece a realizar un seguimiento de su progreso
Inicio de Trailhead
Inicio de Trailhead

Construir una página de registro personalizada para Lightning Experience y la aplicación móvil Salesforce

Objetivos de aprendizaje

Después de completar esta unidad, podrá:
  • Cree una página de registro de objeto personalizada para Lightning Experience y la aplicación móvil Salesforce.
  • Agregar reglas de visibilidad en un componente de página de registro.
  • Activar la página de registro personalizada para los usuarios.

¿Y estas páginas de registros de Lightning Experience? ¡También puede personalizarlas!

Utilice el Generador de aplicaciones Lightning para agregar, eliminar o reordenar los componentes de una página de registro con el fin de ofrecer a los usuarios una vista personalizada de los registros de cada objeto. Aún mejor, puede personalizar una página de registro y asignarla a aplicaciones Lightning específicas para proporcionar a sus usuarios el acceso a una página de registro personalizada especialmente para el contexto de la aplicación en la que están trabajando.

Su página de registro

Al igual que la página Inicio, puede crear una página de registro personalizada de dos maneras diferentes: Creándola desde cero empleando una plantilla, duplicando una de sus otras páginas de registro personalizadas o modificando una página existente. No obstante, a diferencia de la página de Inicio, las páginas de registro personalizadas no solo se admiten en la versión de escritorio de Lightning Experience, también en la aplicación móvil Salesforce. Vamos a crear una página de registro empleando una plantilla, luego comprobaremos el aspecto que tiene en la versión de escritorio y en un teléfono.

Crear una página de registro de Lightning personalizada

Creamos una página de registro de oportunidad personalizada.

Vamos a modificar un poco el formato de página de registro estándar para que se haga una idea de cómo se combinan los elementos. Una vez familiarizado con el resultado, atrévase a personalizar sus páginas de registro como desee. Vamos a empezar.

  1. En Configuración, ingrese Generador de aplicaciones en el cuadro Búsqueda rápida y, a continuación, seleccione Generador de aplicaciones Lightning.
  2. Haga clic en Nuevo.
  3. Seleccione Página de registro y empiece a realizar los pasos del asistente.
  4. Asigne el nombre Nueva página de oportunidad a su página y seleccione Oportunidad.
    Empiece a escribir el nombre de un objeto en el campo Objeto para filtrar la lista y encontrar lo que busca con mayor rapidez.
  5. Seleccione la plantilla Encabezado, Subencabezado, Barra lateral derecha y haga clic en Finalizar.
    En el panel de componentes, ve todos los componentes estándar disponibles para las páginas de registro y cualquier componente personalizado que instaló en su organización.
  6. Desde el menú de configuración (Icono del menú de configuración del panel de componentes del Generador de aplicaciones Lightning), seleccione Siempre mostrar iconos.
    El icono que aparece en la paleta muestra qué factores de forma admite cada componente. Por ejemplo, si agrega el componente Noticias en tiempo real de Chatter a su página, se muestra cuando ve la página tanto en la versión de escritorio como en la aplicación móvil Salesforce. No ocurre así con el Publicador de Chatter, que solo se admite en la versión de escritorio. Veremos este comportamiento en acción cuando probemos nuestra página finalizada.
  7. Arrastre el componente Panel de aspectos destacados a la parte superior de la página. Haga clic en Ver cómo funciona en el panel de propiedades del componente para determinar de dónde procede el contenido del panel de aspectos destacados.
  8. Agregue el componente Ruta a la parte debajo del panel de aspectos destacados.
  9. Agregue un componente Chatter a la parte inferior derecha.
  10. Agregue un componente Fichas a la parte inferior izquierda. Agregar componente Fichas El componente Fichas incluye algunas fichas predeterminadas. Vamos a agregar más.
  11. En el panel de detalles del componente Fichas, haga clic en Agregar ficha.
    De forma predeterminada, se agrega otra ficha Detalles. Sin embargo, dado que ya tenemos una, vamos a cambiarla por otra.
  12. Haga clic en la segunda ficha Detalles
  13. En el menú desplegable Etiqueta de ficha, seleccione Personalizado y asigne una etiqueta nueva a la ficha: Elementos recientes. Agregar una ficha nueva
  14. Haga clic en Listo.
  15. Cree una ficha Actividad.
  16. Arrastre la ficha Elementos recientes a la parte superior de la lista Fichas en el panel de propiedades.
    La ficha Elementos recientes se muestra ahora en la primera posición del componente Fichas. Puede hacer clic entre las fichas, pero no cambia nada porque las fichas no contienen ningún componente. Están vacías. Vamos a solucionar esto.
  17. Seleccione la ficha Detalles.
  18. Arrastre un componente Detalles de registro justo debajo de la ficha Detalles, en el área resaltada en verde. Agregar componente Detalles
  19. Agregue un componente Listas relacionadas a la ficha Relacionado, un componente Actividades a la ficha Actividad y el componente Elementos recientes a la ficha Elementos recientes.
  20. Seleccione el componente Fichas en el lienzo y en el panel de propiedades para cambiar el orden de las fichas a: Detalles, Actividad, Elementos recientes, luego Relacionado.
    No puede arrastrar las fichas hasta el componente para moverlas. Solo puede ajustarlas en el panel de propiedades.
  21. Haga clic en Guardar, luego en Aún no.

Dinamizar su página de registro

¿Sabía que puede controlar el momento en que un componente aparece en una página de registro Lightning? Puede filtrar, agregando visibilidad de componentes, las condiciones y la lógica a sus propiedades.

Las propiedades de visibilidad de componente aparecen cuando se selecciona un componente en una página de registro, aplicación o Inicio en el Generador de aplicaciones Lightning. Este comportamiento se aplica a componentes estándar, componentes personalizados y componentes de AppExchange. No es necesario hacer nada en sus componentes personalizados. Todo el proceso se controla mediante el Generador de aplicaciones Lightning. Si no define un filtro, el componente se muestra en la página Lightning como es habitual. Si define uno o varios filtros y establece la lógica de filtro para un componente, este componente permanece oculto hasta que se cumplen los criterios de la lógica de filtro.

Vamos a probarlo. Construiremos filtros para hacer que se muestre un componente de texto enriquecido cuando el Importe de una oportunidad es mayor o igual a 1 millón de $ y su Fase es Cerrada ganada.
  1. Agregue un componente de texto enriquecido encima del componente Chatter en la página.
  2. Ingrese este texto en el componente: ¡Una oportunidad de un millón de dólares cerrada! ¡Genial!
  3. En las propiedades del componente, haga que el texto esté en negrita y centrado, con un tamaño de 18 puntos y cambie el tipo de letra a alguna que le guste.
  4. Mantenga Mostrar como tarjeta seleccionado.
    Este parámetro hace que el texto dentro del componente sea más legible en páginas Lightning agregando un fondo blanco en vez de uno transparente. Alterne el parámetro para ver lo que queremos decir.
  5. Haga clic en Agregar filtro.
  6. Defina Campo como Importe, si no lo está ya.
  7. Defina Operador como Mayor o igual a. Para Valor, ingrese 1000000. Configuración de visibilidad de componente
  8. Haga clic en Listo.
  9. Haga clic en Agregar filtro de nuevo y cree otro filtro para el campo Fase igual a Cerrada ganada.
    Controlar si un componente se muestra en base a valores de campo no es todo lo que puede hacer con las reglas de visibilidad. Como mencionamos, se admiten las páginas de registro personalizadas en Lightning Experience tanto en la versión de escritorio como en la aplicación móvil Salesforce. Las reglas de visibilidad también controlan si los componentes aparecen en una página basándose en el factor de forma (o dispositivo) en el que está viendo la página. Configuremos reglas para un componente para que solo aparezca cuando se ve la página en un teléfono.
  10. Agregue otro componente Texto enriquecido justo debajo del primero.
  11. Ingrese este texto en el componente: Este componente es solo para usuarios móviles.
  12. Personalice el texto como más le guste y luego haga clic en Agregar filtro.
  13. Debajo Tipo de filtro, haga clic en Dispositivo.
  14. Establezca el campo Valor en Teléfono, y haga clic en Listo.
  15. Guarde la página y, a continuación, haga clic en Activación.

Implementar la página de registro personalizada para sus usuarios

¡Ha llegado el momento de mostrar esta genialidad! Vamos a activar la página. Es muy sencillo.

Activación de página de registro

Tiene cuatro opciones para la activación.
  • Convertir la página en el valor predeterminado de la organización para el objeto.
  • Convertir la página en la página de registro de objeto predeterminada para aplicaciones Lightning específicas.
  • Asignar la página a una combinación de aplicaciones Lightning, tipos de registro y perfiles.
  • Asignar a la página un factor de forma, como para escritorio o teléfono.

Observe la última viñeta de la lista. No solo puede crear una página que esté personalizada para las necesidades de sus usuarios, también puede ir un paso más allá y personalizar la página en base al modo que sus usuarios acceden a ella. Puede crear páginas de registro personalizadas exclusivas que solo verán sus usuarios móviles, conteniendo únicamente lo que necesitan en sus desplazamientos. Al mismo tiempo, las páginas de registro solo para la versión de escritorio pueden servir para las necesidades de sus usuarios cuando están trabajando en sus equipos PC o portátiles.

Asignemos esta página a una aplicación específica, tipo de registro y perfil. También nos aseguraremos de que está asignada a los factores de forma de escritorio y teléfono, de modo que podamos verla en ambos sitios.

  1. Haga clic en la ficha Aplicación, Tipo de registro y Perfil.
  2. Haga clic en Asignar a aplicaciones, tipos de registro y perfiles.
  3. Asigne la página a la aplicación de Ventas el factor de forma de escritorio y teléfono, el tipo de registro Principal y el perfil Administrador del sistema.
  4. Revise las asignaciones de la página.
    La columna Nueva página se completa con el nombre de la página que vamos a activar: Nueva página de oportunidad.
  5. Haga clic en Guardar.
¿Lo ve? No puede ser más fácil. Su página de registro personalizada está ahora activa. Vamos a comprobarla.
Nota

Nota

Es posible que piense “esto es magnífico, ¿pero qué ocurre si cambio de idea? ¿Cómo desactivo mi página personalizada? Esto también es muy fácil. Haga clic en Activación, haga clic en la ficha Aplicación, Tipo de registro y Perfil y haga clic en Eliminar asignaciones.

¿Ve lo que hizo aquí?

Ha creado y activado una página. Ahora vamos a verla en acción. En primer lugar la veremos en la versión de escritorio.

  1. Haga clic en Atrás en el encabezado del Generador de aplicaciones.
  2. Desde el Iniciador de aplicación (Icono del Iniciador de aplicación), encuentre y seleccione Ventas, y luego y haga clic en la ficha Oportunidades.
  3. Seleccione cualquier oportunidad abierta con un importe por debajo de 1.000.000 $.
    Es posible que tenga que actualizar la página de oportunidades para que aparezcan los cambios que acaba de realizar.

    Este es el aspecto de la página de registro personalizada con la compañía de ejemplo, Dickenson Mobile Generators. Como asignó la página de registro al perfil Administrador del sistema, puede verla, pero no los demás usuarios en su organización. Puede personalizar las experiencias de sus diferentes usuarios creando páginas de registro personalizadas y asignándolas por aplicación, tipo de registro y perfil de usuario. Proporcione a sus responsables de ventas una vista diferente de las oportunidades a la de sus representantes de ventas. Configure las páginas de cuentas sin fines de lucro de forma diferente a las páginas de cuentas de negocio estándar.
    Registro de oportunidad de ejemplo
    ¿No ve los componentes de texto enriquecido que agregó a la página? Se debe a dos motivos. Para un componente, se debe a que está viendo la página en un dispositivo de escritorio. Llegaremos a esto pronto. Para el otro componente, es porque la oportunidad no cumple los criterios que estableció. Cambiemos eso.

  4. Desde las acciones a nivel de página en el panel Aspectos destacados, seleccione Modificar.
  5. Cambie el importe de la oportunidad para que sea superior a 1.000.000 $, cambie Fase a Cerrada ganada y luego haga clic en Guardar.
    ¡Vaya, mire eso! Ni siquiera tuvo que actualizar la página. Cuando guarda sus cambios y se cumplen los criterios del filtro, la página se actualiza automáticamente para mostrar el componente de texto enriquecido y su mensaje.

    ¡Ahí está el componente!

    Ahora veamos la página en la aplicación móvil Salesforce.

  6. Abra la aplicación en su teléfono.
  7. Si es necesario, inicie sesión con sus credenciales de Trailhead Playground.
  8. Abra el menú, toque el Iniciador de aplicación y abra la aplicación Ventas.
  9. Toque Oportunidades y luego navegue a la oportunidad que actualizó a Cerrada ganada.
    Lo que ve en primer lugar es lo que espera: acciones, aspectos destacados de registros, Ruta. Pero desplácese hacia abajo un poco... Página Oportunidad en la aplicación móvil SalesforceLas fichas de nuestro componente Fichas están apiladas cuando se ven en un teléfono. Puede tocarlas para desplegarlas, ¡pero espere! Falta una. ¿Dónde está la ficha Actividad? Bien, el componente Actividades no se admite en un teléfono, de modo que se descartó en la página. Y debido a que eso provocó que la ficha Actividad estuviese vacía, también se descartó de la página.

    Hacia la parte inferior está el componente que apareció cuando actualizó la oportunidad a más de un millón de dólares. Pero justo debajo está algo que no vimos cuando miramos la página en la versión de escritorio: el componente solo para móvil.
¡Lo ha hecho! Ha dado sus primeros pasos en un universo mucho mayor.

Vamos a continuar con las páginas de aplicación.