Cómo redimensionar dinámicamente la imagen de WordPress sobre la marcha (campo personalizado / opción de tema)

12

Entonces, a solicitud del cliente, necesito poder cambiar el tamaño de una imagen, no de la forma estándar de WordPress ... sino de una imagen extraída de una opción de tema. No puedo simplemente usar el área custom_header, ya que habrá dos o tres (también tengo algunas opciones una vez que se carga la imagen para que el usuario elija cómo debe funcionar el enlace (página, publicación, categoría, sin enlace, enlace externo) , etc)). Estoy usando Options Framework Theme con gran éxito y puedo recuperar la imagen src muy bien, es cuestión de si esto de alguna manera se puede usar en combinación con la función add_image_size () que normalmente se usa para publicar miniaturas. REALMENTE prefiero no seguir la ruta del timthumb y seguir con las API de WordPress (sé que eso es un poco contradictorio con lo que estoy haciendo en primer lugar ...). Cualquier ayuda sería muy apreciada. ¡Gracias!

Zach
fuente
1
Ok, creo que podría haber logrado esto: ¿ <?php $main_image = of_get_option('of_main_image'); $thepost = $wpdb->get_row( $wpdb->prepare( "SELECT * FROM $wpdb->posts WHERE guid = '$main_image'" ) ); $theID = $thepost->ID; echo wp_get_attachment_image( $theID, 'homepage_main' ); ?> Alguien ve algún agujero de seguridad u rarezas aquí? Puede ser útil para otros también. ¡Gracias!
Zach
Dado que el 'guid' es donde se almacena la URL de la imagen (el Marco de opciones utiliza el Cargador de medios WooThemes para almacenar estos datos como un archivo adjunto post_type), entonces puedo acceder a los datos como tales :)
Zach
1
Acabo de agregar esto para completar. No debe cerrarse, ya que otra solución no dañará.
kaiser
1
He enfrentado este problema en tantos sitios web que he creado. No pude encontrar una solución que funcione de manera óptima, ¡así que construí mi propio complemento! ¡Espero que esto ayude! wordpress.org/plugins/fly-dynamic-image-resizer
Junaid Bhura

Respuestas:

6

Cambie el tamaño de las imágenes de WordPress sobre la marcha utilizando las funciones integradas de WordPress.

Use la vt_resizefunción para cambiar el tamaño dinámicamente de las imágenes de WordPress ubicadas en un campo personalizado, imagen destacada, directorio de cargas, complemento de WordPress de NextGen Gallery o incluso un enlace externo a una imagen externa.

Es muy simple de usar, solo copie / pegue el código a continuación en el functions.phparchivo de su tema de WordPress de su tema de WordPress activado actualmente.

Luego, donde sea que necesite cambiar el tamaño de una imagen sobre la marcha, simplemente realice una llamada a esa función siguiendo el uso del parámetro explicado en los comentarios de la función.

Aquí hay un ejemplo de cómo obtener automáticamente la ID de la publicación, la publicación en sí, los valores del campo personalizado de la publicación y cambiar el tamaño de la imagen dinámicamente desde el campo personalizado que contiene la imagen para cambiar su tamaño dinámicamente sobre la marcha.

<?php
// Place this in your functions.php 
function get_postID(){
    global $wp_query;
    $thePostID = $wp_query->post->ID;
}
?>

<?php
// Place the following lines where you want to perform this action.
$postID = get_postID();// Obtain the current Post ID.
$post = get_post($postID);// Takes the current Post ID and returns the database record.
$custom = get_post_custom($post->ID);// Returns a multidimensional array with all custom fields of the Post.
$image = $custom['field-slug'][0];// Specify the array key of the Custom Field containing the image.
// The first parameter is blank. Meaning, we will not be using a Post Attachment.
// The second parameter is the image from our Post's Custom Field value.
// The third and fourth parameters are the width and height of the image after the re-size is performed.
// The fifth parameter means we want to crop this image.
$resizedImage = vt_resize('', $image, 190, 338, true);// Dynamically re-size our image on the fly.
echo '<img src="'.$resizedImage[url].'" width="'.$resizedImage[width].'" height="'.$resizedImage[height].'" title="'.$post->post_title.'" alt="'.$post->post_title.'" />';// The image properties are held in an array. (Use print_r($resizedImage) for array properties.)
?>

Cambie el tamaño de las imágenes de WordPress sobre la marcha vt_resize con soporte multisitio

  • Descripción: Cambiar el tamaño de las imágenes dinámicamente utilizando las funciones integradas de WordPress.
  • Autor: Victor Teixeira
  • Requisitos: PHP 5.2+, WordPress 3.2+

Volví a formatear el código fuente para que sea más legible para mis propios ojos. Si desea el código fuente formateado original, visite el enlace de arriba.

<?php
/*
* Resize images dynamically using wp built in functions
* Victor Teixeira
*
* php 5.2+
*
* Exemplo de uso:
*
* <?php
* $thumb = get_post_thumbnail_id();
* $image = vt_resize($thumb, '', 140, 110, true);
* ?>
* <img src="<?php echo $image[url]; ?>" width="<?php echo $image[width]; ?>" height="<?php echo $image[height]; ?>" />
*
* @param int $attach_id
* @param string $img_url
* @param int $width
* @param int $height
* @param bool $crop
* @return array
*/
if(!function_exists('vt_resize')){
    function vt_resize($attach_id = null, $img_url = null, $width, $height, $crop = false){
    if($attach_id){
        // this is an attachment, so we have the ID
        $image_src = wp_get_attachment_image_src($attach_id, 'full');
        $file_path = get_attached_file($attach_id);
    } elseif($img_url){
        // this is not an attachment, let's use the image url
        $file_path = parse_url($img_url);
        $file_path = $_SERVER['DOCUMENT_ROOT'].$file_path['path'];
        // Look for Multisite Path
        if(file_exists($file_path) === false){
            global $blog_id;
            $file_path = parse_url($img_url);
            if(preg_match('/files/', $file_path['path'])){
                $path = explode('/', $file_path['path']);
                foreach($path as $k => $v){
                    if($v == 'files'){
                        $path[$k-1] = 'wp-content/blogs.dir/'.$blog_id;
                    }
                }
                $path = implode('/', $path);
            }
            $file_path = $_SERVER['DOCUMENT_ROOT'].$path;
        }
        //$file_path = ltrim( $file_path['path'], '/' );
        //$file_path = rtrim( ABSPATH, '/' ).$file_path['path'];
        $orig_size = getimagesize($file_path);
        $image_src[0] = $img_url;
        $image_src[1] = $orig_size[0];
        $image_src[2] = $orig_size[1];
    }
    $file_info = pathinfo($file_path);
    // check if file exists
    $base_file = $file_info['dirname'].'/'.$file_info['filename'].'.'.$file_info['extension'];
    if(!file_exists($base_file))
    return;
    $extension = '.'. $file_info['extension'];
    // the image path without the extension
    $no_ext_path = $file_info['dirname'].'/'.$file_info['filename'];
    $cropped_img_path = $no_ext_path.'-'.$width.'x'.$height.$extension;
    // checking if the file size is larger than the target size
    // if it is smaller or the same size, stop right here and return
    if($image_src[1] > $width){
        // the file is larger, check if the resized version already exists (for $crop = true but will also work for $crop = false if the sizes match)
        if(file_exists($cropped_img_path)){
            $cropped_img_url = str_replace(basename($image_src[0]), basename($cropped_img_path), $image_src[0]);
            $vt_image = array(
                'url'   => $cropped_img_url,
                'width' => $width,
                'height'    => $height
            );
            return $vt_image;
        }
        // $crop = false or no height set
        if($crop == false OR !$height){
            // calculate the size proportionaly
            $proportional_size = wp_constrain_dimensions($image_src[1], $image_src[2], $width, $height);
            $resized_img_path = $no_ext_path.'-'.$proportional_size[0].'x'.$proportional_size[1].$extension;
            // checking if the file already exists
            if(file_exists($resized_img_path)){
                $resized_img_url = str_replace(basename($image_src[0]), basename($resized_img_path), $image_src[0]);
                $vt_image = array(
                    'url'   => $resized_img_url,
                    'width' => $proportional_size[0],
                    'height'    => $proportional_size[1]
                );
                return $vt_image;
            }
        }
        // check if image width is smaller than set width
        $img_size = getimagesize($file_path);
        if($img_size[0] <= $width) $width = $img_size[0];
            // Check if GD Library installed
            if(!function_exists('imagecreatetruecolor')){
                echo 'GD Library Error: imagecreatetruecolor does not exist - please contact your webhost and ask them to install the GD library';
                return;
            }
            // no cache files - let's finally resize it
            $new_img_path = image_resize($file_path, $width, $height, $crop);
            $new_img_size = getimagesize($new_img_path);
            $new_img = str_replace(basename($image_src[0]), basename($new_img_path), $image_src[0]);
            // resized output
            $vt_image = array(
                'url'   => $new_img,
                'width' => $new_img_size[0],
                'height'    => $new_img_size[1]
            );
            return $vt_image;
        }
        // default output - without resizing
        $vt_image = array(
            'url'   => $image_src[0],
            'width' => $width,
            'height'    => $height
        );
        return $vt_image;
    }
}
?>
Michael Ecklund
fuente
Esta es una función mucho más simple (no es compatible con múltiples sitios, pero ¿alguien en su sano juicio usa varios sitios?) Github.com/BrettMW/img_resize
developerbmw
También una solución utilizable lista github.com/bueltge/WP-Image-Resizer , como el enlace de @kaiser
bueltge
@bueltge, funciona, pero ¿tienes idea de por qué las imágenes están borrosas? Parece que hace todas las imágenes de 150x150. ¿Alguna idea de por qué está sucediendo eso?
Ionut
@bueltge, no importa. He encontrado el problema Tuve que establecer el tamaño completo como segundo parámetro al usarwp_get_attachment_image_url()
Ionut
@bueltge, tacha eso. Parece que no está funcionando ... ¿me pueden ayudar con esto? Cuando agrego el tamaño de la imagen, las fullimágenes tienen diferentes tamaños.
Ionut