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 realizar una vista previa de su aplicación en la aplicación móvil de Salesforce.
  

Nota

¿Su idioma de aprendizaje es español? Comience el reto en un Trailhead Playground en español y utilice las traducciones proporcionadas entre paréntesis para navegar. Copie y pegue solo los valores en inglés, ya que las validaciones del reto se basan en los datos en inglés. Si no aprueba el reto en su organización en español, le recomendamos que (1) cambie la configuración regional a Estados Unidos, (2) cambie el idioma a inglés, siga las instrucciones descritas aquí y, a continuación, (3) vuelva a hacer clic en el botón Check Challenge (Comprobar el reto).

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 instrucciones adicionales para usuarios de lectores de pantalla. Para acceder a una versión detallada de esta unidad para lectores de pantalla, haga clic en el siguiente vínculo:

Open Trailhead screen reader instructions (en inglés).

Personalizar componentes Lightning en el Generador de aplicaciones Lightning

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

Administradores a los que les gustan las herramientas sencillas: esta es su unidad. Le proporcionamos un componente personalizado que ya está configurado. Así que no se preocupe. No necesita tener conocimientos de programación para obtener esta insignia.

Puede crear un componente Lightning personalizado utilizando componentes web Lightning. Vea el módulo Fundamentos de componentes web Lightning.

Los componentes personalizados de su organización que se configuran para utilizarlos en el Lightning App Builder (Generador de aplicaciones Lightning) aparecen en el panel Lightning Components (Componentes Lightning).

Los componentes Lightning personalizados no funcionan automáticamente en las páginas Lightning o en el Lightning App Builder (Generador de aplicaciones Lightning). Para que eso ocurra, debe configurar el componente y su paquete de componentes de manera que sea compatible con el Lightning App Builder (Generador de aplicaciones Lightning) y las páginas Lightning. Consulte 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 Lightning App Builder (Generador de aplicaciones Lightning).

Instalar un componente Lightning personalizado

Ha facilitado un componente Lightning personalizado de alerta de oportunidad que puede agregar a su página Lightning. Ahora, vamos a instalarlo en su organización.

Inicie su Trailhead Playground. Para ello, vaya a cualquier reto práctico, desplácese hasta la parte inferior de la página y haga clic en Launch (Iniciar). Si ve una ficha en su organización etiquetada como Install a Package (Instalar un paquete), excelente. Siga los pasos que se describen a continuación.

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

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

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

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

1. En Setup (Configuración), escriba App Builder (Generador de aplicaciones) en el cuadro Quick Find (Búsqueda rápida) y, a continuación, seleccione Lightning App Builder (Generador de aplicaciones Lightning).
   
2. Haga clic en Edit (Modificar) junto a la página Top Accounts and Opportunities (Cuentas principales y oportunidades) que creó en la unidad anterior.
   
3. Agregue el componente de alerta de oportunidad sobre el componente List View (Vista de lista).
   
4. En el panel de propiedades, cambie Days Since Last Modified (Días desde la última modificación) a 6.
   ¿Se ha dado cuenta de que el texto dentro del componente ha cambiado para coincidir con el valor del nuevo campo?
   
5. Anule la selección Has Open Tasks (Hay tareas abiertas) y, a continuación, haga clic en Save (Guardar).
   

Como activó la página anteriormente, no tiene que volver a hacerlo.

¡Perfecto! Los cambios que realizó están disponibles en Lightning Experience y en la aplicación móvil. Ahora, consulte la página.

Probar el componente personalizado

Empiece por verlo primero en la aplicación móvil de Salesforce.

1. Abra la aplicación en su dispositivo móvil.
   
2. Si fuese necesario, inicie sesión utilizando sus credenciales de Trailhead Playground.
   
3. Vaya a la página Top Accounts and Opportunities (Cuentas principales y oportunidades) y desplácese hasta abajo hasta que vea el nuevo componente. Es posible que tenga que actualizar la pantalla para visualizar los cambios. 
   

Vuelva a su organización y vea la página Top Accounts and Opportunities (Cuentas principales y oportunidades) en Lightning Experience. Como creó la página utilizando una plantilla de dos columnas, se utiliza el formato de dos columnas cuando la ve desde el ordenador o desde una tablet.

Enhorabuena. Ha utilizado el Lightning App Builder (Generador de aplicaciones Lightning) para crear una página de aplicación, personalizar la página de inicio de Lightning Experience y una página de registro de Lightning Experience.

Ahora, cuenta con las habilidades necesarias para hacer sus usuarios encuentren la aplicación móvil de Salesforce y Lightning Experience más accesibles y más potentes. Continúe y personalice.

Recursos

• Guía del desarrollador de componentes web Lightning
• Guía del desarrollador de componentes web Lightning: Configure a Component for Lightning App Builder
• Ayuda de Salesforce: Personalizar componentes de páginas Lightning