Contrarrestar
Los números cuentan una historia poderosa, especialmente cuando se animan ante los ojos de los visitantes. El elemento Counter Up convierte sus estadísticas clave en pantallas dinámicas y atractivas. Muestre a sus clientes satisfechos, proyectos completados o cualquier métrica importante con una animación de conteo suave que comienza desde cero y llega hasta su número final. Organice varios contadores en una cuadrícula limpia, agregue íconos o imágenes y diseñe cada detalle para que coincida con su marca. Es la forma comprobada de generar confianza, resaltar logros y agregar un toque de interactividad moderna a cualquier sección de su sitio.
Diseños de cuadrícula flexibles de varias columnas
No solo muestre una estadística, muestre un conjunto de logros. Agregue varios elementos de contador y luego organícelos en una cuadrícula responsiva. Elija de 1 a 6 columnas para adaptarse perfectamente a su diseño, ya sea en un pie de página apretado o en una sección de héroe espaciosa. La cuadrícula se ajusta y apila automáticamente maravillosamente en el móvil, lo que garantiza que sus estadísticas se vean geniales en todos los dispositivos. Esta estructura es perfecta para crear esas secciones clásicas de “Hitos” o “Datos divertidos”.
- Sistema Responsive Grid: Organice contadores en hasta 5 columnas para escritorio, con apilamiento automático en tableta y móvil.
- Mostradores ilimitados: agregue tantos artículos de mostrador como necesite: clientes, proyectos, horarios, tazas de café, cualquier cosa.
- Espaciado equilibrado: la cuadrícula mantiene un espaciado y una alineación constantes para una apariencia profesional y equilibrada.
Conteo animado suave
La magia está en movimiento. En lugar de mostrar un número estático, el contador comienza en 0 y se anima suavemente hasta su número objetivo (como 6000+). Esta sutil animación llama la atención, enfatiza el crecimiento y hace que la estadística parezca más significativa y ganada. Controlas el número final, el prefijo/sufijo (como el símbolo “+”) y el ritmo del conteo para lograr el efecto dramático perfecto.
- Movimiento que llama la atención: el recuento continuo naturalmente atrae la atención del visitante hacia sus métricas clave.
- Formato personalizable: agregue prefijos (como “$”) y sufijos (como “K” o “+”) a sus números.
- Duración controlada: influye en la velocidad de la animación de conteo para que coincida con el ritmo de tu sitio.
Personalización visual completa
Tus contadores deberían parecer una parte integral de tu diseño. Diseñe el Counter Box general con colores de fondo, relleno, márgenes, bordes y sombras. Luego, personalice cada componente: el ícono/imagen (tamaño, posición, fondo), el número animado (color, tipografía) y el título debajo. Tienes control independiente sobre los colores, las fuentes y el espaciado de cada parte, lo que permite infinitas combinaciones creativas.
- Estilo de componentes individuales: peine el ícono, el número y el título de forma independiente con colores y tipografía separados.
- Flexibilidad de iconos e imágenes: utilice iconos de cualquier biblioteca habilitada o cargue imágenes personalizadas como anclajes visuales para cada estadística.
- Encuadre profesional: utilice sombras de caja, radio de borde y colores de fondo para que cada objeto del mostrador explote.
Preguntas frecuentes para el mostrador
¿La animación de conteo se reproduce cada vez que alguien la pasa?
Normalmente, la animación se activa una vez cuando el elemento entra por primera vez en la ventana gráfica durante la carga de una página. Si el usuario se desplaza hacia afuera y hacia atrás, normalmente no se reproducirá a menos que se actualice la página. Esto evita que la animación se vuelva repetitiva y distraiga.
¿Puedo usar imágenes en lugar de íconos para los gráficos del contador?
¡Sí! En la Configuración de iconos, puede optar por cargar una imagen personalizada en lugar de seleccionar un icono. Luego puede controlar el tamaño y la posición de la imagen, lo que le permite utilizar logotipos, ilustraciones personalizadas o fotografías para representar cada estadística.
¿tener múltiples contadores con animaciones ralentizará mi página?
La animación es liviana y utiliza JavaScript eficiente. Tener de 4 a 5 contadores en una página tiene un impacto insignificante en el rendimiento. Sin embargo, como ocurre con cualquier elemento de la página, si tiene docenas de contadores, es una buena práctica probar la velocidad de su página. El principal factor de rendimiento es siempre la optimización de su imagen/icono.
¿cuál es un buen caso de uso para un diseño de contador de una sola columna?
Un diseño de una sola columna es perfecto para barras laterales, secciones estrechas o cuando desea que cada contador sea un punto focal importante en su propia línea, tal vez con un ícono más grande y una descripción más detallada debajo del título.
¿Puedo hacer que el contador comience desde un número distinto de cero?
El efecto clásico y más atractivo es contar desde 0 hasta su número objetivo, ya que enfatiza visualmente el crecimiento o la acumulación. Las configuraciones mostradas se centran en ese efecto. Para comenzar desde otro número, es posible que deba explorar un código personalizado o buscar una configuración avanzada en el widget.
¿los contadores son compatibles con los datos dinámicos de Elementor?
El elemento Counter Up está diseñado principalmente para números estáticos ingresados manualmente que representan un hito o logro fijo. Para mostrar datos dinámicos que cambian automáticamente (como un recuento de visitantes en vivo), normalmente necesitará un widget o integración diferente y más especializado.
Widgets y extensiones de Elementor de tendencia
Cree sitios web sofisticados en menos tiempo.
Vidriomorfismo
Extras de contenedores
Patrones
Duplicador de publicaciones/páginas
