Cómo minimizar los archivos CSS / JavaScript en WordPress

¿Quieres minimizar los archivos en tu sitio de WordPress? La reducción de los archivos CSS y Javascript de WordPress puede hacer que se carguen más rápido y acelerar su sitio de WordPress. En esta guía, le mostraremos cómo minimizar los archivos CSS / Javascript en WordPress para mejorar el rendimiento y la velocidad..

Qué es Minify y cuándo lo necesitas?

El término "Reducir" se usa para describir un método que hace que el tamaño del archivo de su sitio web sea menor. Logra este objetivo al eliminar los espacios en blanco, las líneas y los caracteres innecesarios del código fuente..

Por lo general, se recomienda que se use solo para los archivos que se envían a los navegadores de los usuarios. Esto incluye archivos HTML, CSS y JavaScript. También puede minimizar los archivos PHP, pero PHP es un lenguaje de programación del lado del servidor y al minimizarlo no mejorará la velocidad de carga de la página para sus usuarios.

La ventaja obvia de minimizar archivos es la velocidad y el rendimiento mejorados de WordPress. Los archivos compactos son más rápidos para cargar y mejorar la velocidad de su sitio.

Sin embargo, algunos expertos creen que la mejora del rendimiento es muy pequeña para la mayoría de los sitios web y no vale la pena. La minificación solo disminuye algunos kilobytes de datos en la mayoría de los sitios de WordPress. Puede reducir más el tiempo de carga de página simplemente optimizando las imágenes para la web.

Aquí hay un ejemplo de código CSS normal:

cuerpo
margen: 20px;
relleno: 20px;
color: # 333333;
fondo: # f7f7f7;

h1
tamaño de fuente: 32px;
color # 222222;
margen inferior: 10px;

Después de minimizar el código se verá así:

cuerpo margen: 20px; relleno: 20px; color: # 333; fondo: # f7f7f7 h1 tamaño de fuente: 32px; margen inferior: 10px

Si estás tratando de lograr una puntuación de 100/100 en Google Pagespeed o la herramienta GTMetrix, entonces la CSS y JavaScript de minificación mejorarán significativamente tu puntuación.

Habiendo dicho eso, echemos un vistazo a cómo reducir fácilmente CSS / JavaScript en su sitio de WordPress.

Reducir CSS / Javascript en WordPress

Lo primero que debes hacer es instalar y activar el complemento Better WordPress Minify. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

Tras la activación, el complemento agregará un nuevo elemento de menú etiquetado 'BWP Minify' a su barra de administración de WordPress. Haciendo clic en él te llevará a la página de configuración del plugin..

En la página de configuración, debes revisar las dos primeras opciones para minimizar automáticamente los archivos de JavaScript y CSS en tu sitio de WordPress.

Ahora puede hacer clic en el botón Guardar cambios para almacenar su configuración.

Hay muchas otras opciones avanzadas en esta página. La configuración predeterminada funcionará para la mayoría de los sitios web, pero puede revisar y cambiar estas opciones caso por caso..

A continuación, debe dirigirse a su sitio web. Haga clic derecho en cualquier lugar y luego seleccione 'Ver origen de página' en el menú del navegador.

Ahora verá el código fuente HTML generado por su sitio de WordPress. Si observa detenidamente, notará que este complemento cargará archivos CSS / JavaScript desde la propia carpeta del complemento en lugar de sus temas y complementos de WordPress..

Estas son las versiones reducidas de tus archivos CSS y JavaScript originales. El mejor complemento de WordPress Minify los mantendrá en caché y ofrecerá las versiones minificadas a los navegadores.

Eso es todo, esperamos que este artículo te haya ayudado a aprender cómo reducir el tamaño de tu sitio de WordPress. También puede consultar nuestra guía definitiva sobre cómo acelerar WordPress para principiantes..

Si le ha gustado este artículo, suscríbase a nuestros tutoriales en video del Canal de YouTube para WordPress. También puedes encontrarnos en Twitter y Facebook..