Trabajar con componentes Lightning personalizados

Objetivos de aprendizaje

Después de completar esta unidad, podrá:

• Instalar un componente Lightning personalizado
  
• Utilizar su dispositivo móvil para obtener una vista previa de su aplicación en la aplicación móvil Salesforce
  

Nota

¿Es su idioma de aprendizaje español (LATAM)? Comience el reto en un Trailhead Playground en español (LATAM) y copie y pegue los valores en español (LATAM). Si no aprueba el reto en su organización en español (LATAM), recomendamos que (1) cambie la configuración local a Estados Unidos, (2) cambie el idioma a inglés (según estas instrucciones) y, luego, (3) haga clic en el botón “Check Challenge” (Comprobar el reto) nuevamente.

Consulte la insignia Trailhead en su idioma para obtener más información sobre cómo aprovechar la experiencia de Trailhead en otros idiomas.

Accesibilidad

Esta unidad requiere algunas instrucciones adicionales para los usuarios de lectores de pantalla. Para acceder a una versión detallada para lectores de pantalla de esta unidad, haga clic en el siguiente vínculo:

Abrir las instrucciones para lectores de pantalla de Trailhead.

Componentes Lightning personalizados en el generador de aplicaciones Lightning

La creación de un componente Lightning personalizado requiere conocimientos de programación. O bien, puede instalar un componente Lightning existente desde AppExchange.

Los administradores que usen herramientas interactivas (apuntar y hacer clic) también pueden completar esta unidad. Le vamos a proporcionar un componente personalizado que ya está configurado. Por lo tanto, no tiene por qué preocuparse. No necesita tener conocimientos de programación para conseguir esta insignia.

Puede crear un componente Lightning personalizado mediante los componentes web Lightning. Consulte el módulo Fundamentos de los componentes web Lightning.

Los componentes personalizados de su organización que están configurados para su uso en el generador de aplicaciones Lightning se muestran en el panel Componentes Lightning.

Sus componentes Lightning personalizados no funcionan automáticamente en páginas Lightning o en Generador de aplicaciones Lightning. Para hacer que un componente personalizado se pueda utilizar en ambos, necesita configurar el componente y su paquete de componentes de modo que sean compatibles con el Generador de aplicaciones Lightning y las páginas Lightning. Consulte la Guía del desarrollador de componentes web Lightning para obtener más información.

El componente personalizado que proporcionamos para este módulo ya se ha configurado para el generador de aplicaciones Lightning.

Instalar un componente Lightning personalizado

Proporcionó un componente Lightning de alertas de oportunidad que puede agregar a su página Lightning. Ahora instálelo en su organización.

Inicie su Trailhead Playground dirigiéndose a cualquier unidad con un reto práctico y desplazándose hasta la parte inferior de la página y haciendo clic en Iniciar. Si ve una ficha en su organización etiquetada como Instalar un paquete, ¡excelente! Siga los pasos que se describen a continuación.

En caso contrario, haga clic en el icono del iniciador de aplicación para abrir el Iniciador de aplicación, luego haga clic en Playground Starter y siga los pasos. Si no ve la aplicación Playground Starter, copie este vínculo de instalación de paquete y consulte Instalar un paquete o una aplicación para completar un reto de Trailhead en la Ayuda de Salesforce.

1. Haga clic en la ficha Instalar un paquete.
   
2. Pegue 04t2E00000161fSQAQ en el campo.
   
3. Haga clic en Instalar.
   
4. Seleccione Instalar solo para administradores y, a continuación, haga clic en Instalar.
   

Una vez completada la instalación, ya puede agregar el componente a su página.

Agregar el componente Lightning personalizado a su página de aplicación

1. En Setup (Configuración), ingrese App Builder (Generador de aplicaciones) en el cuadro Quick Find (Búsqueda rápida) y, a continuación, haga clic en Lightning App Builder (Generador de aplicaciones Lightning).
   
2. Haga clic en Modificar junto a la página Cuentas y oportunidades principales que creó en la unidad anterior.
   
3. Agregue el componente Alerta de oportunidad por encima del componente Vista de lista.
   
4. En el panel de propiedades, cambie Days Since Last Modified (Días desde la última modificación) a 6.
   ¿Observó que el texto del componente cambió y ahora coincide con el nuevo valor de campo?
   
5. Anule la selección de Tiene tareas abiertas, luego haga clic en Guardar.
   

Dado que ha activado la página anteriormente, no necesita volver a activarla.

¡Perfecto! Los cambios que ha realizado están disponibles de inmediato en Lightning Experience y la aplicación móvil. Veamos qué aspecto tiene la página ahora.

Probar el componente personalizado

Primero va a verlo en la aplicación móvil Salesforce.

1. Abra la aplicación en su dispositivo móvil.
   
2. Si es necesario, inicie sesión con sus credenciales de Trailhead Playground.
   
3. Vaya a la a la página Cuentas y oportunidades principales en la aplicación Ventas y desplácese hacia abajo hasta que vea el nuevo componente. Es posible que tenga que actualizar la pantalla para ver sus cambios. 
   

Vuelva a su organización y vea la página Top Accounts and Opportunities (Cuentas y oportunidades principales) en Lightning Experience. Dado que ha creado la página con la plantilla Two Columns (Dos columnas), se usa el formato de dos columnas al ver la página en el escritorio o una tablet.

¡Felicitaciones! Utilizó el generador de aplicaciones Lightning para crear una página de aplicación, personalizar su página de inicio de Lightning Experience y personalizar una página de registro de Lightning Experience.

Ya tiene los conocimientos necesarios para aumentar la facilidad de uso y eficiencia de la aplicación móvil Salesforce y Lightning Experience para los usuarios. ¡Anímese a personalizar!

Recursos

• Guía del desarrollador de componentes web Lightning
• Guía del desarrollador de componentes web Lightning: Configurar un componente para el Generador de aplicación Lightning
• Ayuda de Salesforce: Componentes de página Lightning personalizados