El escalado de imágenes automático de WordPress no está pensado para conseguir imágenes perfectas de manera consistente. ¿Pero qué pasaría si pudieras conseguir imágenes perfectas cada vez sin excepción y sin ningún esfuerzo?
Es posible hacerlo con un plugin, pero vamos a mostrarte cómo hacerlo sin instalar nada. Cambiando unas pocas líneas de código en el código de tu sitio web, puedes conseguir imágenes perfectas siempre en tu blog de WordPress.
Paso 1 – Ten los recursos adecuados
Empieza reuniendo los recursos adecuados. Esto no tardará más de cinco minutos, pero facilitará muchísimo el proceso.
- El inspector/depurador del navegador. Esto depende de tu navegador. Para Firefox, se llama Firebug y, para Chrome, se llama Inspector. Puedes usarlo para ver el marcado de las páginas web en tu navegador.
- Editor de código. Un buen editor de código es vital. No dudes en utilizar un editor gratis o premium. Una buen opción es Netbeans y otra Notepad++.
- Programa de FTP. Lo necesitarás para subir y descargar archivos al servidor. FileZilla y Cyberduck son dos buenas opciones.
Paso 2 – ¿Cuál es tu ancho de columna?
Si quieres imágenes perfectas, debes conocer tu ancho de columna. Éste es un factor clave en lo que respecta a las imágenes en las entradas. Si la imagen supera el ancho prescrito, se superpondrá a cualquier cosa que haya en la barra lateral.
Puedes averiguar tu ancho de columna de varias maneras:
- Mira en las opciones de tema.
- El editor de temas. Si realmente quieres perder el tiempo, puedes examinar el código del archivo de tema.
- Usa el depurador de tu navegador para examinar el código de tu sitio web.
Paso 3 – Decide el tamaño estándar de imagen
Si tienes un tamaño estándar de imagen para tu sitio web, querrás cambiarlo. Una vez que conozcas la anchura del recuadro, decide el tamaño que quieres. Es necesario que modifiques el código para adaptarlo a tu contenido. Pero nunca lo hagas dentro del archivo de tema, ya que esto puede causar inestabilidad.
Edita el archivo functions.php en el directorio del tema. Si estás usando el framework Genesis o Thesis, estará en el archivo custom_functions en su lugar.
Añade ‘add_image_size(‘full-width’, WIDTH, HEIGHT);’ al archivo functions.php. Se puede usar 9999 para proporcionar tamaños de imagen ilimitados.
Paso 4 – Añade funcionalidad de reescalado de imágenes personalizada
Añade el código add_image_size(‘full-width-ratio’, 600, 9999);.
Esto proporcionará un tamaño de imagen que no recortará nada de lo que añadas. Es decir, WordPress redimensionará tu imagen según la relación de aspecto original. Así que ahora tienes escalado sin recorte total, posibilitando imágenes perfectas en tu blog de WordPress.
Ten en cuenta las imágenes que uses
Recuerda que si estás jugando con imágenes, la calidad importa. Las imágenes de baja calidad, al ser redimensionadas, conducirán a una mayor pérdida de calidad. Es por eso que empezar con imágenes grandes y escalarlas/recortarlas es siempre la opción más deseable.
Para finalizar, reconsidera usar imágenes particularmente grandes. Éstas pueden ralentizar los sitios web. Google suele penalizar a los sitios web que tardan más de un par de segundos en cargar, así que podrías dañar tus esfuerzos SEO y bajar de clasificación en el motor de búsqueda.