Image editing


Hello,

I don't understand very well how to use image editing

$resized_src = beans_edit_image( $image_src, array(
    'resize' => array( 600, 400, array( 'center', 'top' ) )
) );

What have i to put in $resized_src and in $image_src, i need a true example.

For ex i want to make a gallery with a certain image size, normally i create this image size with add_image_size function.

Then for ex i use a custom field, so people can unpload images, and i retrieve them like that

$image_url = wp_get_attachment_image_url( $image_id, 'gallery' );

Having created a gallery image size.

Let's say for ex that i want to change the quality of all these images, how i do that ?

Also is it possible to trully crop the images ?

In wordpress if i create an image size of 500X500 it will keep the proportion even with crop true, and will not crop to the exacts dimensions.

Wordpress as only this option for thumbnails, which is annoying


Hey Alex,

So assuming that you get your image url stored in your $image_url variable, below is how you would change the quality to 50%:

$image_url = wp_get_attachment_image_url( $image_id, 'gallery' );

// Set quality to 50% and re-assign the value to the $image_url variable.
$image_url = beans_edit_image( $image_src, array(
    'set_quality' => array( 50 ),
) );

To crop it to 500x500 and centered, you would do it as such:

$image_url = wp_get_attachment_image_url( $image_id, 'gallery' );

// Crop the image to 500x500 centered and re-assign the value to the $image_url variable.
$image_url = beans_edit_image( $image_src, array(
    'resize' => array( 500, 500, array( 'center', 'center' ) ),
    'set_quality' => array( 100 ),
) );

Note that I have set the quality to a 100% as otherwise, WordPress automatically decreases it to 82%.

Have fun,



It works, and it is extrelemy usefull! i just change this code

$image_url = beans_edit_image( $image_url, array(
    'resize' => array( 500, 500, array( 'center', 'center' ) ),
    'set_quality' => array( 100 ),
) );

having again $image_url for image_src So no need to create image sizes, to regenerate thumbnails, to optimize images before uploading them.

Very usefull for photographers website that often uplaod images of several Mo as they don't know they have to optimize, and end up with super slow websites !


Jo

I really don't understand how to use Beans Image API like I use the default WordPress Image API? How do i set an unique $name, so i can use it like this: the_post_thumbnail( '$name' ); ?

Example: This is the way i use in WordPress:

// Crop image for Portfolio thumbnails.
add_image_size( 'thumbnail-portfolio', 200, 400, array( 'center', 'center' ) );

// Crop image for Blog thumbnails.
add_image_size( 'thumbnail-blog', 200, 200, array( 'center', 'center' ) );

// Crop image for Single Post thumbnails.
add_image_size( 'thumbnail-single', 800, 500, array( 'center', 'center' ) );

Can be used on theme like this:

// On Portfolio page
the_post_thumbnail( 'thumbnail-portfolio' );

// On Blog page
the_post_thumbnail( 'thumbnail-blog' );

// On Single page
the_post_thumbnail( 'thumbnail-Single' );

I want to take all advantages that Beans offers like setting quality and the stored images can be reuploaded on the fly if i change something to the function (which WordPress itself don't offer this).

How can i do this (like example) with Beans Image API?

Edited 8 months ago by Jo


Hi Jozi,

The image API functions should be used on the fly. The image source must be passed to the beans_edit_image() function as well as the necessary arguments (see the code reference here) and the function will return the edited image url to set the src attribute of the image HTML tag.

Is there a specific example you would like to make use of the Beans Image API to edit images?

Thanks,

Write a reply

Login or register to write a reply, it's free!