Una guía para los tamaños de recorte de imagen de WordPress

WordPress 3.9 ha salido con una gran cantidad de energía adicional bajo el capó. Una característica nueva e impresionante entre muchas, es la capacidad adicional de controlar ahora la posición de recorte de las imágenes cargadas en WordPress; esto es realmente elegante!!


Antes de continuar, muchas gracias a Brad Touesnard ¡Quién ha hecho esta increíble contribución que ahora se ha incluido en el núcleo de WordPress! Pensé que esta sería una gran oportunidad no solo para explicar cómo aprovechar esta nueva característica, sino también para ejecutarla y obtener un buen control de todo el alcance de esta función.

El principio: agregar o personalizar tamaños de imagen

Por defecto, WordPress genera 3 veces más versiones de su imagen. Una versión “Miniatura”, una versión “Mediana” y una “Grande”. El tamaño de imagen original cargado se conoce como la versión “completa”.

Personalizar los valores predeterminados

Puede sobrescribir los valores predeterminados de cada uno de estos tamaños de cultivo con bastante facilidad. Puedes ir a tu Panel de WordPress, Configuración >> Medios y cambie los valores allí o puede hacerlo a través de su tema o archivo de funciones de complemento de esta manera:

update_option ('thumbnail_size_w', 250);
update_option ('thumbnail_size_h', 250);
update_option ('thumbnail_crop', 1);

Agregar tamaños adicionales

Puede colocar rápida y fácilmente esta función en su tema o archivo de funciones de complemento:

add_image_size ($ nombre, $ ancho, $ altura, $ recorte);

Terminaría pareciéndose a esto:

add_image_size ('homepage-thumb', 250, 250, verdadero);

Cultivo duro normal

Propina: Recuerde dar a cada tamaño de imagen adicional su propio nombre único ;-).

Todo lo que necesita saber se puede encontrar a través de WordPress Codex.

Algunos WordPress 3.9+ Magia – Control de la posición de recorte

El parámetro $ crop era anteriormente solo un valor booleano, verdadero o falso. Entonces, ya sea un cultivo proporcional suave o un cultivo duro si se establece en verdadero (siga leyendo más abajo para ver la diferencia entre un cultivo duro y suave). Sin embargo, ahora puede usar una matriz para especificar el posicionamiento del área de recorte, (x_crop_position, y_crop_position). Me gustan las imágenes recortadas del centro, así que, por ejemplo, su función podría verse así ahora:

add_image_size ('homepage-thumb', 250, 250, array ('centro', 'centro'));

Recorte duro seleccionado por el usuario

El parámetro $ crop todavía acepta valores verdaderos / falsos y, según Brad, es totalmente compatible con versiones anteriores. La sintaxis es idéntica a la de la propiedad de posición de fondo CSS, por lo que es familiar tanto para los diseñadores como para los desarrolladores, pero aquí, en cualquier caso, es por razones de claridad..

arriba a la izquierda
centro izquierdo
abajo a la izquierda
Justo arriba
centro derecho
boton derecho
parte superior central
centro centro
centro inferior

Entonces lo tengo recortado, ahora ¿Cómo lo uso??

La gran noticia … ¡es exactamente lo mismo! Para un desglose completo, como siempre mira el WordPress Codex. Aquí hay un recordatorio en cualquier caso. Para llamar a esta imagen personalizada en su tema o complemento. En el ejemplo que hemos estado usando, así es como:

the_post_thumbnail ('homepage-thumb');

o…

wp_get_attachment_url (get_post_thumbnail_id ($ post-> ID, 'homepage-thumb'));

Pero, ¿qué pasa con todas mis imágenes existentes??

Como probablemente sepa, los tamaños de los cultivos se reciclan y generan en el momento de la carga. Esto ahora significa que después de hacer uso de esta nueva función agregando nuestra posición de recorte personalizada o cambiando / agregando un nuevo tamaño de recorte, ahora nos queda lo que se generó en el momento de la carga y ninguna de estas nuevas versiones de imágenes está disponible para nosotros, no genial!

Aaah pero espera … Afortunadamente, hay mucha gente inteligente e increíble en la comunidad de WordPress para salvar el día, aquí está el regenerar complemento de miniaturas. Este complemento ha existido durante mucho tiempo, ¡es fantástico! Recorrerá todas las imágenes cargadas existentes y regenerará todos los nuevos tamaños de imagen que haya agregado o personalizado. Problema de Woohooo resuelto ��

Duro vs. Cultivo suave: usted decidió

Cultivo duro

Cultivo duro normal
La imagen se escalará y luego se recortará a las dimensiones exactas que haya especificado. Dependiendo de la proporción de la imagen en relación con el tamaño del recorte, es probable que la imagen siempre se corte.

Cultivo suave

Cultivo suave
Un recorte suave nunca cortará ninguna parte de la imagen, la reducirá hasta que se ajuste a las dimensiones especificadas, manteniendo su relación de aspecto original.

Algo que vale la pena saber …

En el caso de que cualquier dimensión de la imagen cargada (ancho o alto) sea menor que la del tamaño de recorte establecido, se omitirá y no se creará una versión para ese tamaño. WordPress recorrerá todos los tamaños de imagen establecidos y solo creará las versiones de esas imágenes que sean más grandes que la de la versión que está tratando de generar. En tal caso, cuando se recupera una imagen dentro de su tema o complemento y no existe, la imagen original, “Completa”, se utilizará como alternativa..

Disfrute implementando esta nueva característica en sus temas y complementos. Es hora de patear el culo y recortar algunas imágenes ��

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map