Saltar al contenido principal
ES Deutsch English Français Italiano Português

Widgets de animaciones de Lottie

El widget de animaciones de Lottie permite agregar animaciones de calidad vectorial a su sitio.

Lottie es una biblioteca móvil para Android e iOS que analiza las animaciones de Adobe After Effects exportadas como JSON con Bodymovin y las representa en dispositivos móviles y en la web.

Busque la animación a través de LottieFiles o cree su propia animación en After Effects, exportada con el complemento Bodymovin.

Para agregar el widget:

  1. En el panel izquierdo, haga clic en Widgets.
  2. Haga clic y arrastre el widget Animación de Lottie a su sitio.

Para obtener más información sobre cómo agregar widgets a su sitio, consulte Agregar widgets.

Editor de contenido

Para acceder al editor de contenido:

  1. Haga clic con el botón derecho en el widget y haga clic en Editar contenido.
  2. Copie el URL de la animación de Lottie en el cuadro proporcionado.
  3. Para ubicar el URL de la animación, abra la animación en LottieFiles y haga clic en <html>. Alternativamente, puede pegar el URL de cualquier archivo JSON alojado fuera de LottieFiles.
  4. Seleccione Loop Animation (Animación en bucle) para reproducir la animación de forma continua o seleccione Animate on click (Animar al hacer clic).
  5. (Opcional) Para agregar un enlace a la animación, haga clic en Link (Enlace) y seleccione el tipo de enlace.
  6. Si utiliza una animación gratuita de LottieFile, debe incluir la información de las credenciales del creador de la animación. La información del creador de la animación se encuentra en la parte inferior del elemento emergente de la animación. Para obtener más información, consulte la información de licencia de Creative Commons de LottieFile.

Editor de diseño

Para acceder al editor de diseño, haga clic con el botón derecho en el widget y haga clic en Editar diseño.

Para cambiar el tamaño del widget, mueva los controles deslizantes de ancho y alto. Para mantener las proporciones de ancho y alto, seleccione Keep proportion (Mantener proporción).

Para obtener información sobre las opciones de diseño que no son específicas de este widget (por ejemplo, diseño, estilo o espaciado), consulte Diseño de widgets.