Safelayout Cute Preloader – CSS3 WordPress Preloader

Descripción

La primera impresión es fundamental. Cuando un visitante llega a tu sitio web, una plantilla de carga lenta o imágenes grandes pueden provocar una transición de diseño desordenada y poco profesional. Safelayout Cute Preloader soluciona esto al instante ocultando los espacios de carga con una pantalla de entrada profesional y con una animación atractiva que se adapta perfectamente al estilo de diseño y la imagen corporativa de tu sitio.

En lugar de quedarse mirando una pantalla en blanco y abandonar tu sitio frustrados, tus visitantes verán una transición fluida y adaptable. Puedes mostrar el logotipo de tu empresa, cadenas de texto personalizadas y degradados de fondo suaves que combinen a la perfección con los colores de tu tema activo. Transforma una página de espera aburrida en una introducción elegante y con la imagen de tu marca.

🚀 Alto rendimiento, impacto de velocidad cero

Muchos creadores web evitan las animaciones de carga porque temen que un plugin ralentice su servidor. Safelayout Cute Preloader está diseñado con una configuración de animación puramente CSS. Dado que nunca procesa recursos de imágenes GIF pesadas ni archivos JavaScript voluminosos que bloquean la renderización, su impacto en la velocidad de la página es completamente insignificante. Protege sus Core Web Vitals y garantiza un rendimiento fluido en dispositivos móviles y ordenadores modernos.

🎨 Posicionamiento de marca totalmente personalizada

Tienes control total sobre el diseño, los colores y las estructuras de maquetación sin tener que editar el código. Solo tienes que activar o desactivar los ajustes preconfigurados desde tu panel de administración para combinar bonitos degradados lineales en los gráficos del cargador, los elementos de texto y los paneles de fondo. ¿Quieres un aspecto totalmente único? Sube tu propio logotipo personalizado, selecciona elegantes efectos de filtro visual, aplica estilos cinéticos complejos al texto o utiliza sutiles patrones geométricos de fondo para darle a tu sitio web una identidad distintiva.

🏷️ Lógica de indicador de carga múltiple y reglas avanzadas para dispositivos

Esta utilidad proporciona marcos de enrutamiento únicos y flexibles para sitios web en crecimiento:
* El sistema de indicador de carga especial: ejecute diseños de carga completamente diferentes en diferentes secciones de su sitio web simultáneamente. Por ejemplo, puede asignar un diseño dinámico para los procesos de marketing de su página de destino mientras mantiene una configuración mínima y profesional en las áreas de pago de WooCommerce.
* Filtro de visibilidad inteligente: mantenga sus bucles de contenido adaptables mediante controles de dispositivo granulares.. Elija ejecutar su animación globalmente en todas las pantallas, mostrarla solo en móviles o restringirla estrictamente a las pantallas de escritorio.

Descubre por qué los creadores de sitios web confían en Safelayout para obtener diseños impecables. Su configuración sencilla y lista para usar le da a tu proyecto web una apariencia profesional desde el momento en que el usuario hace clic en tu enlace.

Cómo añadir diferentes indicadores de carga a diferentes páginas/entradas de tu sitio.

Cómo establecer un indicador de carga para diferentes tipos de datos, por ejemplo, un indicador de carga diferente para productos.

Cómo establecer un indicador de carga diferente para los visitantes móviles.

Características

  • Animación CSS pura (sin imágenes GIF).
  • 35 iconos de animación de carga.
  • 18 efectos de salida de fondo.
  • animación de fondo.
  • Patrón de fondo.
  • 14 efectos de animación de imagen de marca.
  • 11 efectos de animación de texto.
  • barra de progreso y contador.
  • Compatible con diferentes navegadores.
  • Totalmente personalizable.
  • Funciona con cualquier tema.
  • Añade tu propia imagen de carga.
  • Preciosos colores degradados para el icono, la barra de progreso y el fondo.
  • Hermosos efectos de filtro para iconos.
  • Control de dispositivo (Elige mostrar en todos los dispositivos, móvil, o solamente escritorio).
  • Tiempo mínimo de ejecución del indicador de carga.
  • Tiempo máximo de ejecución del indicador de carga.
  • Botón de cierre del indicador de carga.
  • Indicador de carga especial: puede tener más de un indicador de carga en su sitio. Un indicador de carga diferente para un tipo de datos específico (producto) o un indicador de carga diferente para una página/entrada específica.

Demostración en vivo

Safelayout Cute Preloader Demo.

Versión Pro

Safelayout Cute Preloader Pro está disponible. Actualice a la versión Pro y obtenga características completas.

Otros plugins de Safelayout

Safelayout Elegant Icons – WordPress icon block

Safelayout Brilliant Buttons – WordPress Button block

Safelayout Animated Header Footer

Capturas

Instalación

Instalación automática (recomendada)

  1. Ve a tu Escritorio de WordPress > Plugins > Añadir nuevo
  2. Introduce «Safelayout Cute Preloader» en la barra de búsqueda de palabras clave.
  3. Haz clic en Instalar ahora y luego en Activar.

Instalación manual mediante la subida de un archivo ZIP

  1. Descarga la carpeta oficial con el archivo comprimido del plugin desde el repositorio de plugins de Safelayout Cute Preloader en WordPress.org.
  2. Dirígete a la pantalla del escritorio Plugins -> Añadir plugin -> Subir plugin.
  3. Selecciona la estructura de archivos, ejecuta el script de instalación y haz clic en Activar.

FAQ

¿Este plugin ralentizará las puntuaciones de rendimiento de mi sitio web?

No, en absoluto. Safelayout Cute Preloader está diseñado específicamente para la velocidad. Se ejecuta completamente con un motor de animación CSS ligero y puro, sin utilizar imágenes GIF pesadas ni archivos JavaScript voluminosos que bloqueen la renderización. La velocidad de carga de su servidor principal se mantiene rápida y sus Core Web Vitals permanecen totalmente protegidos.

¿Qué hace que la función «Indicador de carga especial» sea única?

Los plugins de precarga estándar solo permiten mostrar un único estilo de carga en todo el sitio web. El framework Special Preloader rompe con esta limitación. Permite crear e implementar varios precargadores diferentes simultáneamente, lo que significa que puedes asignar un estilo único y dinámico a tus páginas de destino, a la vez que mantienes un diseño limpio y minimalista en las páginas de pago de WooCommerce.

¿Puedo usar el logotipo de mi propia empresa como cargador?

¡Sí! No tienes por qué usar nuestros iconos prediseñados. Puedes subir fácilmente tu propia imagen de marca o logotipo corporativo directamente desde el panel de administración, aplicarle perfiles de animación de imagen premium y usarlo como elemento de carga principal.

¿Puedo restringir la animación de carga solo a dispositivos móviles?

Sí. El plugin incluye controles de dispositivo detallados. Desde el panel de ajustes, puedes elegir mostrar tu indicador de carga personalizado en todas las pantallas, dirigirlo exclusivamente a las ventanas de visualización de teléfonos móviles o restringir la visualización solo a monitores de escritorio.

¿El plugin funciona con cualquier tema de WordPress?

Sí. El plugin está construido con variables de estilo adaptable que funcionan a la perfección con cualquier estructura de diseño estándar, incluidos los temas clásicos tradicionales y los temas de bloques de edición completa del sitio (FSE) modernos.

Reseñas

9 de junio de 2026 1 respuesta
From install to frontend works like a charm!
30 de abril de 2026
this plugin really helped a lot because in slow internet when site is loading slowly a customer don’t feel bored because this plugin make my website preloader very nice way
14 de abril de 2026
I use it on two small websites for personal projects, but i could see this scaling up well for large companies! It works perfectly, and has just the right amount of customization available. It also has yet to conflict with any of my other plugins – unlike my previous preloader plugin.
Leer todas las 83 reseñas

Colaboradores y desarrolladores

«Safelayout Cute Preloader – CSS3 WordPress Preloader» es un software de código abierto. Las siguientes personas han colaborado con este plugin.

Colaboradores

«Safelayout Cute Preloader – CSS3 WordPress Preloader» está traducido en 5 idiomas. Gracias a los traductores por sus contribuciones.

Traduce «Safelayout Cute Preloader – CSS3 WordPress Preloader» a tu idioma.

¿Interesado en el desarrollo?

Revisa el código , echa un vistazo al repositorio SVN o suscríbete al registro de desarrollo por RSS.

Registro de cambios

2.2.7

  • Changed the default value of some settings.

2.2.6

  • Fixed rate reminder and upgrade notification issue.

2.2.5

  • Interfaz de usuario actualizada.

2.2.4

  • Algunos problemas corregidos.

2.2.3

  • Algunos problemas corregidos.

2.2.2

  • Se ha añadido una nueva función: patrón de fondo.
  • Algunos problemas corregidos.

2.2.1

  • Algunos problemas corregidos.

2.2.0

  • Se ha añadido una nueva función: animación de fondo.

2.1.7

  • Algunos problemas corregidos.
  • Interfaz de usuario actualizada.

2.1.6

  • Interfaz de usuario actualizada.

2.1.5

  • Se solucionó un problema con WP Rocket.

2.1.4

  • Algunos problemas corregidos.

2.1.3

  • Se ha añadido la opción de no mostrar el preloader si JavaScript está deshabilitado.

2.1.2

  • Se han añadido 3 nuevos tipos de animación para el texto.

2.1.1

  • Mayor compatibilidad con los plugins de caché.

2.1.0

  • Se añadió código para excluir la optimización CSS y JS del indicador de carga por plugins de cache.

2.0.98

  • Algunos problemas corregidos.

2.0.97

  • Activado la función Dispositivo, en la versión gratuita.

2.0.96

  • Algunos problemas corregidos.

2.0.95

  • Se añadió una condición para que no se muestre el indicador de carga en el editor Gutenberg.

2.0.93

  • Se añadió la opción de vaciar la caché después de cambiar los ajustes.

2.0.92

  • Pestaña de preajustes eliminada.

2.0.91

  • Se modificaron los ajustes preestablecidos de la pestaña.
  • Se modificaron los ajustes de tiempo de carga (tiempo mínimo de carga, tiempo máximo de carga, mostrar botón de cierre después).

2.0.90

  • Se solucionó un problema con el estilo CSS del fondo.

2.0.80

  • Se añadió la pestaña de preajustes.
  • Animación de la barra de progreso actualizada.
  • Interfaz de usuario actualizada.

2.0.71

  • Se solucionó el problema del icono personalizado.
  • Se eliminó la etiqueta noscript.

2.0.70

  • Se añadió un nuevo efecto de animación para la imagen de marca.
  • Se añadió un pequeño fondo.
  • Interfaz de usuario actualizada.

2.0.60

  • Se mejoró el código de inserción del indicador de carga.

2.0.50

  • Se añadió un nuevo efecto de animación para la imagen de marca.
  • Icono de bubble1 actualizado.
  • Se añadió el estilo RTL a la barra de progreso Stripe.

2.0.40

  • Se han actualizado algunos iconos de animación de carga.
  • CSS de iconos personalizados actualizado.
  • Animación de imagen de marca actualizada.
  • Animación de la barra de progreso actualizada.
  • Botón de cierre del preloader actualizado.
  • Readme.txt actualizado

2.0.31

  • Se han actualizado algunos iconos de animación de carga.
  • Se ha añadido la función de redimensionamiento a la lista de selección de entradas.
  • Se solucionó un problema con la etiqueta iframe de HTML.
  • Se solucionó el problema del filtro http_request_host_is_external.

2.0.21

  • Se solucionó el problema del icono triple-spinner.

2.0.2

  • Interfaz de usuario actualizada.
  • Se ha añadido un nuevo icono de animación de carga.

2.0.1

  • Readme.txt actualizado
  • Se cambió el tiempo del recordatorio de la valoración.

2.0

  • Se aumentó la velocidad del indicador de carga.
  • Menor consumo de memoria por el indicador de carga.

1.9.4

  • Se ha solucionado un problema con el tamaño del fondo en algunos temas.
  • Se mejoró el código de inserción del indicador de carga.

1.9.3

  • Se han añadido tres nuevos tipos de iconos.
  • Se cambió la vista previa de la barra de progreso.
  • Se cambió el color de algunos iconos.

1.9.2

  • Se cambió el tiempo de visualización del mensaje de actualización.
  • Solución: La retroalimentación de desactivación no funciona.

1.9.1

  • Se eliminó la demostración de las funciones Pro de la versión gratuita.

1.9.0

  • Se añadió algo de color en la versión gratuita.
  • Se añadió algunos efectos de icono en la versión gratuita.

1.8.1

  • Se solucionó el problema de retroalimentación de desactivación.

1.8.0

  • Se aumentó la velocidad del indicador de carga.
  • Se añadió dos nuevos tipos de barras de progreso.
  • Se añadió una notificación de recordatorio de pago en el panel de control de WordPress.

1.7.0

  • Se añadió algo de color en la versión gratuita.

1.6.0

  • Tipos especiales: preloader para diferentes tipos de datos, por ejemplo, un preloader diferente para productos.
  • Se activó la función de color de texto, en la versión gratuita.
  • Se activó la función de color del contador, en la versión gratuita.
  • Se activó la función de color del borde de la barra de progreso en la versión gratuita.

1.5.0

  • Se añadió barra de progreso y contador.

1.4.0

  • Se añadió 23 nuevos iconos de animación de carga.
  • Se activó la función de tamaño de icono, en la versión gratuita.

1.3.2

  • Se solucionó el problema de sincronización de la animación de la imagen de marca.

1.3.1

  • Se cambió el diseño de la página de ajustes.

1.3.0

  • Se añadió un preloader especial (puedes tener más de un preloader en tu sitio web).
  • Se añadió imagen de marca con 12 efectos de animación.

1.2.1

  • Se han protegido todos los archivos .php contra el acceso directo.

1.2.0

  • Se añadió la opción de activar/desactivar el indicador de carga.
  • Se añadió la opción de excluir el error 404 (página no encontrada).
  • Se añadió la opción de excluir la página de «búsqueda no encontrada».
  • Se añadió la opción de excluir páginas/entradas por ID.
  • Se añadió la opción de excluir páginas/entradas por tipo de nombre.
  • Se añadió la función de Solo búsqueda a la opción Mostrar en.

1.1.2

  • Se solucionó el problema de mostrar solo una vez por sesión.

1.1.1

  • Se mejoró el código de inserción del indicador de carga.

1.1.0

  • Animaciones de texto mejoradas.

1.0.2

  • Corregido el diseño de la página de ajustes para los idiomas que se escriben de derecha a izquierda (RTL).
  • Se activó la función de tamaño de fuente en la versión gratuita.
  • Se activó la función de margen superior en la versión gratuita.

1.0.1

  • Activado la función Mostrar en la versión gratuita.
  • Activado la función Mostrar por sesión, en la versión gratuita.
  • Activado la función Dispositivo, en la versión gratuita.

1.0

  • Versión inicial.