¿Necesita agregar un efecto de desplazamiento en Elementor a través de CSS personalizado?
Elementor tiene una función incorporada para agregar un efecto de desplazamiento a un elemento (cubrimos esto en uno de nuestros artículos. Si bien la función es lo suficientemente útil, tiene una desventaja. Solo puede agregarle un efecto de desplazamiento. Una sección, una columna, un widget de imagen, un widget de botón y un widget de publicaciones.
Lea también: Cómo instalar Elementor en WordPress
La función de efecto de desplazamiento incorporado de Elementor no le permite agregar un efecto de desplazamiento a otros widgets como el widget Editor de texto, el widget Título, etc. Otro inconveniente es que solo puede agregar un efecto de desplazamiento muy básico.
¿Hay alguna otra opción para agregar efecto de desplazamiento en Elementor?
Sí, hay. Puede agregar un efecto de desplazamiento en Elementor a través de CSS personalizado. Pero para agregar CSS personalizado, debe usar Elementor Pro, ya que el CSS personalizado solo está disponible en Elementor Pro.
Agregar un efecto de desplazamiento en Elementor a través de CSS personalizado
Antes de comenzar, echemos un vistazo al ejemplo de los efectos de desplazamiento creados mediante CSS personalizado.
A diferencia del efecto de desplazamiento integrado de Elementor, puede usar este método para agregar un efecto de desplazamiento a cualquier elemento en Elementor. Ya sea una sección, columna o widget (todos los widgets).
En este ejemplo, le mostraremos cómo agregar un efecto de punto a una columna.
Primero, haga clic en el identificador de la columna para cambiar al panel de configuración de la columna. Una vez allí, ve a la pestaña Avanzado y abre el bloque Personalizado CO y pegue el siguiente código CSS.
selector: hover {transición: todos .2s entrada-salida fácil; transformar: escala (1.1); cursor: punto; índice z: 1; }
Voilà.
En el código anterior, estamos usando la propiedad CSS transformar() para agregar el efecto de desplazamiento. El tipo de transformación que estamos usando en este ejemplo es escala, con una duración de 1,1 segundos.
Hay otros 4 tipos de transformación que puede usar con:transform
- Matrix
- Traducir
- Girar
- oblicuidad
Si desea utilizar un estilo de transformación diferente, puede simplemente reemplazar el valor de transformar en el código CSS anterior.
Usted puede leer esta página para obtener más información sobre la transformación CSS.
Puede seguir la misma ruta para agregar un efecto de desplazamiento a otros elementos.
Para agregar un efecto de señalar a una sección, puede hacer clic en el identificador de la sección e ir a la pestaña Avanzado y abre el bloque CSS personalizado.
Para agregar un efecto de desplazamiento a un widget, puede hacer clic en el controlador del widget y volver a la pestaña. Avanzado, luego abre el bloque CSS personalizado.
Otros complementos premium adicionales de WordPress
Descubre también otros plugins de WordPress premium que optimizan el rendimiento de tu blog o sitio web de WordPress.
1. Live Sales Popup
La ventana emergente de ventas en vivo es otra Plugin de WordPress notificación con varias golosinas que puedes convertir en una ventaja. En primer lugar, tiene la posibilidad mostrar una ventana emergente cuando alguien completa un pedido. 
En segundo lugar, la ventana emergente de ventas en tiempo real también puede mostrar una notificación cuando una persona simplemente agrega un artículo al carrito. Y tercero, puede utilizar la herramienta para impulsar la publicidad de un producto mostrando cuántos visitantes vieron el artículo.
Con las últimas tendencias web, puede esperar que Live Sales Popup se muestre a la perfección en todos los dispositivos y navegadores. En cuanto al diseño emergente, puede personalizarlo hasta el más mínimo detalle.
leer: Cómo reparar una alerta de seguridad en su blog de WordPress
Las otras características de Live Sales Popup son más de treinta animaciones, sonidos, cuenta regresiva y posicionamiento personalizado. También funciona para notificaciones falsas y le permite configurarlo solo para páginas específicas donde desea que la notificación realice su tarea.
Descargar | Demo | alojamiento web
2. Foodify
Alimentar es la forma más rápida y fácil para que los clientes ordenen comida en una tienda. Es enteramente sensible e incluye funciones adicionales como imagen, opción de búsqueda, información del producto. 
También agrega botones a la canasta para mejorar la experiencia del usuario. Esta extensión de WooCommerce es una solución de pedidos rápida y completa que se puede agregar a cualquier sitio web de WooCommerce.
Aqui para ti Complementos de 5 WordPress para optimizar descripciones de categorías y etiquetas
Tiene la ventaja de ser muy flexible y compatible con muchos complementos existentes en el directorio de WordPress.
Descargar | Demo | alojamiento web
3. Visor de imágenes Mega Zoom y Pan
El complemento Mega Zoom & Pan Image Viewer es un excelente visor de imágenes y navegador con un diseño totalmente receptivo para mostrar imágenes grandes en su blog de WordPress.
Es una poderosa herramienta diseñada para presentar productos (imágenes de productos en alta resolución. Ej: Ropa, autos, esquemas técnicos, etc.), mostrar mapas y todas las demás imágenes, gracias a su zoom, su función panorámica, sus controles de navegación, su barra de desplazamientoy marcadores / puntos de acceso altamente personalizables.
Estos son 5 aplicaciones para teléfonos inteligentes para proteger sus imágenes y videos
Este complemento funciona muy bien en iOS (iPad, iPhone), Android y Windows Mobile, etc. También funciona en todos los navegadores modernos y navegadores más antiguos como IE7 o IE8.
Otros recursos recomendados
También lo invitamos a consultar los recursos a continuación para avanzar en el control y agarre de su sitio web y blog.
- Cómo eliminar todos los comentarios pendientes en WordPress
- ¿Cuándo y cómo instalar WordPress en un subdirectorio
- 5 complementos de WordPress para agregar la alegría de la Navidad a su sitio web
- Complementos de WordPress de 10 para mejorar el aspecto visual de su sitio web.
Conclusión
Listo ! Eso es todo por esta guía. Esperamos que este artículo lo haya ayudado a agregar el efecto de desplazamiento en Elementor a través de CSS personalizado. También puede leer nuestro artículo sobre Cómo arreglar el bloqueo de renderizado de JavaScript y CSS en WordPress.
Sin embargo, también podrá consultar nuestra Recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress o el de Divi: el mejor tema de WordPress de todos los tiempos.
Si tiene un amigo o un comentario, déjelo en la sección comentario. Sobretodo comparte este artículo en tus diferentes redes sociales.
...
