Sastrería Web ORG

Paso 1: Crear o Conseguir el GIF de Ruido Estático
1. Crear el GIF:
   - Si prefieres hacerlo tú mismo, puedes usar herramientas como Photoshop o generadores de GIF en línea para crear un GIF animado que simule ruido estático.
   - Si prefieres descargar un GIF, busca "static noise GIF" en internet y asegúrate de tener los derechos de uso.

2. Subir el GIF a tu Servidor:
   - Sube el archivo GIF al directorio de imágenes de tu tema en Thirty Bees. Por ejemplo, podrías subirlo a `themes/tu-tema/img/`.

Paso 2: Añadir el Fondo Degradado y el GIF al CSS
1. Accede al Archivo CSS de tu Tema:
   - Ve al archivo principal de estilos CSS de tu tema. Esto suele estar en `themes/tu-tema/assets/css/custom.css` o similar.

2. Añadir el Código CSS:
   - Añade el siguiente código CSS para aplicar el fondo:

css
   body {
     background-image: url("../img/noise.gif"), radial-gradient(circle, rgb(242, 251, 248) 0%, rgb(248, 254, 252) 100%);
     background-size: cover;
     background-repeat: no-repeat;
     background-blend-mode: overlay;
   }

   

   - Explicación del código:
     - `background-image`: Combina el GIF de ruido estático y el degradado radial verde.
     - `url("../img/noise.gif")`: Especifica la ruta al GIF. Ajusta esta ruta según la ubicación del archivo.
     - `radial-gradient(circle, rgb(242, 251, 248) 0%, rgb(248, 254, 252) 100%)`: Crea un degradado radial con tonos verdes muy suaves.
     - `background-size: cover`: Asegura que el fondo cubra toda la pantalla.
     - `background-repeat: no-repeat`: Evita la repetición de la imagen de fondo.
     - `background-blend-mode: overlay`: Mezcla los dos fondos, permitiendo que el GIF de ruido se superponga al degradado.

Paso 3: Verificar y Ajustar
1. Verifica tu Sitio:
   - Accede a tu sitio para ver el fondo en acción. Verifica cómo se ve en diferentes dispositivos y navegadores para asegurarte de que el efecto sea consistente.

2. Ajustes Adicionales:
   - Si el ruido estático es demasiado fuerte o demasiado débil, puedes ajustar la opacidad del GIF o cambiar los colores del degradado en el CSS.

¡Y eso es todo! Ahora tendrás un fondo con un suave degradado verde y un efecto de ruido estático animado para darle un toque único a tu sitio de Thirty Bees.