[NUEVO] Círculo interactivo en diseños web: cómo crear uno en Elementor sin codificación
Publicado: 2021-12-29Un sitio web con mucho texto puede ser poco atractivo a la vista. Si su sitio web consta de demasiados textos y menos componentes visuales, puede usar un círculo interactivo de Essential Addons y mostrar su contenido en un patrón circular atractivo. Sumerjámonos para aprender cómo mostrar una gran cantidad de contenido en un espacio mínimo usando este increíble widget.
¿Por qué necesita el widget de círculo interactivo en su sitio web?
Para los diseñadores web, se convierte en un desafío hacer que el sitio web sea más interactivo y, al mismo tiempo, conveniente para el usuario. Si el sitio web contiene mucho contenido basado en texto, se vuelve más difícil presentarlo de la manera correcta.
La investigación dice que casi el 38% de las personas dejan de interactuar con cualquier sitio web que tenga un diseño poco atractivo. En este caso, el tráfico de su sitio web también depende del diseño de su sitio web. Exploremos todos los beneficios que obtendrá al diseñar de manera efectiva su contenido basado en texto utilizando un widget de círculo interactivo de Essential Addons en su sitio web de WordPress.
Presentación animada del contenido de su sitio web
A pesar de que su sitio web incluye una gran cantidad de contenido basado en texto, puede presentarlo de una manera convincente para atraer a los visitantes y facilitarles la visita. Son comunes diferentes patrones para presentar el material de su sitio web, por lo que un poco de movimiento podría ayudarlo a atraer el interés de sus visitantes. Con el widget de círculo interactivo de Essential Addons, puede mostrar su contenido basado en texto con un patrón animado y hacer que la sección se vea más atractiva.
Diseño interactivo y receptivo para su sitio web
Puede ser difícil para los usuarios encontrar su sitio web en los motores de búsqueda, leer contenido o navegar por su sitio web si carece de un diseño receptivo. Esto podría deberse a fallas de diseño, imágenes deficientes, texto demasiado pequeño o demasiadas infografías que hacen que su sitio web se vea desordenado. Si está utilizando una computadora de escritorio o portátil, puede cambiar el tamaño de esta ventana haciendo clic y arrastrando la esquina.
Crear un diseño dinámico para su sitio web puede ser más fácil utilizando un widget de círculo interactivo de los complementos esenciales. No importa qué tipo de dispositivo usen los visitantes de su sitio web para acceder a su sitio web, su diseño no se romperá si usa este widget para presentar su contenido basado en texto.
Widget de círculo interactivo para crear un hermoso sitio web
Puede mostrar su contenido basado en texto en un atractivo movimiento circular con este widget, atrayendo la atención de los usuarios de su sitio web. Si desea proporcionar su menú de contenido, por ejemplo, puede usar un círculo interactivo para presentar el contenido y al mismo tiempo ahorrar espacio. Un contenido simple basado en texto parecerá más fascinante y tentador de esta manera. Averigüemos con qué facilidad puede comenzar con el widget de Círculo interactivo mediante el complemento Complementos esenciales.
Cosas que necesita para usar Interactive Circle por Essential Addons
Elementor : para usar el widget de círculo interactivo, primero debe instalar y activar Elementor, después de lo cual estará listo para comenzar.
Complementos esenciales para Elementor : debe instalar y activar Complementos esenciales para Elementor en su sitio web para usar el widget 'Círculo interactivo'.
Paso 1: active el widget de círculo interactivo de complementos esenciales
Hagamos que su sitio web sea más interactivo y atractivo utilizando el widget ' Círculo interactivo ' de Essential Addons. Todo lo que necesita hacer es asegurarse de estar utilizando la última versión de este complemento.
El widget de círculo interactivo debe estar habilitado en Elementor. Vaya a Elementos de complementos esenciales en su panel de control de WordPress y asegúrese de que el widget ' Círculo interactivo ' esté activado. Para asegurarse de que sus cambios se guarden, haga clic en el botón ' Guardar configuración '.
Busque el widget ' Círculo interactivo ' en la pestaña 'Elementos' de Elementor. Arrastra y suelta los elementos donde quieras mostrar el contenido basado en texto.
Paso 2: comience a personalizar la configuración de su contenido
Este widget le permite personalizar el contenido predeterminado y agregar su propio contenido. Desde la pestaña General, puede establecer cualquier diseño de las opciones. El widget de círculo interactivo viene con 4 diseños preestablecidos . Juegue con los diseños y vea cuál se adapta mejor a su contenido basado en texto.
También puede elegir si los botones de su widget de EA Interactive Circle deben mostrar iconos o texto. Para ocultar o mostrar iconos y texto, cambie las opciones ' Mostrar icono ' y ' Mostrar texto' en la configuración de 'Botón' , respectivamente. Este widget es muy útil para muchas personalizaciones. Puede elegir entre las opciones y crear su propio menú circular según sus preferencias.
La parte más importante del uso de este widget es que puede proporcionar su propio contenido y agregar más opciones circulares según sea necesario. Puede agregar la cantidad de elementos que desea mostrar con su widget de EA Interactive Circle en la configuración de 'Contenido' . Simplemente haga clic en el botón ' + Agregar elemento ' para agregar un nuevo elemento. De la misma manera, puede eliminar o copiar un elemento de la configuración. Sin embargo, por el bien del diseño, solo puede agregar hasta 8 opciones a la vez; de lo contrario, la secuencia se rompería.
Hay tres pestañas: 'Botón ', 'Contenido ' y 'Estilo '. Puede agregar un icono para el elemento y editar el título desde el campo de entrada ' Título corto ' en la pestaña 'Botón'. Del mismo modo, puede agregar contenido a su artículo desde la pestaña 'Contenido' y puede agregar colores de fondo a su artículo desde la pestaña 'Estilo' .
Puede recibir opciones de configuración adicionales desde la opción ' Configuración adicional ' para ayudarlo a hacer que su widget de EA Interactive Circle sea más dinámico. Puede elegir entre interacciones 'Clic' y 'Hover' en la opción ' Mouse Event '. También puede usar la opción ' Configuración adicional ' para agregar animaciones elegantes y llamativas. Como se ilustra a continuación, hay tres estilos de animación diferentes para elegir.
Paso 3: Dale estilo a tu contenido interactivo basado en texto
El widget EA Interactive Circle viene con muchas opciones de estilo. Esta opción puede marcar una gran diferencia en términos del círculo interactivo de cualquier persona. Al modificar el color de fondo, el patrón o el color del texto, el ancho del círculo y el relleno o la fusión, puede cambiar la apariencia.
Puede modificar la tipografía de cada elemento en su Círculo interactivo de EA desde la configuración de ' Elemento '. El ancho de cada elemento y el tamaño del icono también se pueden ajustar. También puede modificar el color de fondo, el color del texto, el color de los iconos y muchas otras cosas.
Si está satisfecho con la apariencia de su círculo interactivo, ahora puede publicar su página. Eche un vistazo al círculo interactivo de Elementor que hicimos para este tema.
Como puedes ver, Essential Addons for Elementor permite crear un magnífico Círculo Interactivo y convertir tu página web en una forma más fascinante y extremadamente simple.
Finalmente, creemos firmemente en el valor de la mejora continua. Con esto en mente, estamos trabajando arduamente para ofrecerle nuevos complementos esenciales fantásticos para las actualizaciones de Elementor para que pueda tener una experiencia de diseño de sitios web aún mejor con Elementor.
¿Y que tienes que perder? Actualice a Essential Addons 5.0 lo antes posible para aprovechar todos los nuevos widgets y extensiones avanzados, incluido el widget Interactive Circle.
Pruébelo usted mismo y, si tiene alguna pregunta, comuníquese con nuestro equipo de soporte . Suscríbase a nuestro blog o únase a nuestra amigable comunidad de Facebook para obtener más información sobre los últimos complementos de Elementor, tutoriales de diseño web, consejos y trucos, y más.