crop image to a certain size in wordpress - wordpress

I am trying to crop a image to a certain.
I have tried using
add_image_size( 'other', 105, 70, true );
$imageString.= '<div>' . get_the_post_thumbnail($post->ID, 'other;) . '</div>';
But it does not seem to crop to that exact dimension.
Any Ides?

Generally you add image sizes into your functions.php file.
//post thumbnail support
add_action( 'after_setup_theme', 'theme_setup' );
function theme_setup() {
if ( function_exists( 'add_theme_support' ) ) {
add_image_size( 'other', 105, 70, true );
}
}
Then, once in place, for all new image uploads wordpress will create an image at that size.
If you want to create these image sizes for already uploaded images, have a look at http://wordpress.org/extend/plugins/regenerate-thumbnails/

In my experience, get_the_post_thumbnail doesn't always work if you use custom image size added with add_image_size.
I'd advise you to use add_image_size, but get the image throught wp_get_attachment_image_src like this:
$imageurl = wp_get_attachment_image_src($attachment->ID, "other" );
$imageString.= '<div><img src="' . $imageurl[0] . '"/></div>';

The functions related to image resizing and cropping are all placed in media.php.
For example, start reading about image_resize_dimensions which will also give you dimensions for cropping. Those dimensions can then be used with imagecopyresampled.

Related

Define a new cropping image size in Wordpress

Inside Wordpress, I need to generate and create inside the upload folder a new cropping image size that has:
width=205px
height=120px
Inside my function.php here is my code:
// Call function on after setup
add_action( 'after_setup_theme', 'theme_setup_img' );
function theme_setup_img() {
add_theme_support( 'post-thumbnails' );
add_image_size('search-thumb', 205, 120, true );
// set_post_thumbnail_size( 205, 120, true );
}
However, no new image-sizes have been created inside the upload folder (only default WP sizes). Any solution?
Note: I'm using the default theme and the latest WP version
Your code looks correct. Mine is slightly different and I know it works:
if (function_exists('add_theme_support'))
{
// Add Thumbnail Theme Support
add_theme_support('post-thumbnails');
add_image_size('large', 700, '', true); // Large Thumbnail
add_image_size('medium', 250, '', true); // Medium Thumbnail
}
This was taken from the HTML5 Blank Theme by Todd Motto. Gerald also mentioned writing a script to re-render but there's a great plugin for that called Regenerate Thumbnails that does the same thing.
This might be due to you calling the new size inside the "after_setup_theme" action... I use the following code:
// Add custom image sizes
if( function_exists( 'add_image_size' ) ) {
add_image_size( 'search-thumb', 205, 120, true );
}
And it works every time... if it's inside the functions.php file, you don't need an action or hook to make it work.
Also, you can add this to functions.php to make your custom sizes show up in the drop down menus when inserting images into pages/posts/where ever:
// Functions to add custom image sizes to the media library thickbox area
// and put them into drop down
function my_insert_custom_image_sizes( $sizes ) {
// get the custom image sizes
global $_wp_additional_image_sizes;
// if there are none, just return the built-in sizes
if ( empty( $_wp_additional_image_sizes ) )
return $sizes;
// add all the custom sizes to the built-in sizes
foreach ( $_wp_additional_image_sizes as $id => $data ) {
// take the size ID (e.g., 'my-name'), replace hyphens with spaces,
// and capitalise the first letter of each word
if ( !isset($sizes[$id]) )
$sizes[$id] = ucfirst( str_replace( '-', ' ', $id ) );
}
return $sizes;
}
add_filter( 'image_size_names_choose', 'my_insert_custom_image_sizes' );
You will need a plugin (I use AJAX Thumbnail Rebuild) to resize old images already uploaded before this code was implemented.
The problem here was the "Dynamic Image Resizer" plug-in.
It was breaking my theme with Wordpress 4.0.

images are cropping automatically in wordpress

i'm working on wordpress with themify parallax theme.there is a option in parallax theme setting to use header gallery.when i choose the images for gallery they are looking blurry.then i noticed that i have uploaded the image(bg04) of size 1024x619 and after checking the page with firebug its showing extra bg04-1024x536.jpg in every image.
Here are my media settings:
Thumbnail size 150x150
Medium size 300x300
Large size 1024x1024
Please guys help me on this.
You can add custom size for thumbnail images
add_image_size( $name, $width, $height, $crop );
or use for getting original image size
get_the_post_thumbnail( $post_id, $size, $attr )
where $size = 'full'
You can something add this to your themes functions.php file to give it custom sizes.
/* Add Post Thumbnails */
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 110, 96, true ); // Normal post thumbnails
add_image_size( 'post-image', 350, 350, TRUE ); // Post image
add_image_size( 'news-listing', 140, 140, TRUE ); // News Listing image
add_image_size( 'slider_image', 1070, 378, TRUE ); // Slider image
}
And then to grab the specific sizes you use
$src = grab_featured_img_url('slider-image');
(Sorry if you already knew how to do that, just covering all bases :) )
If you dont want wordpress to crop your images for you, and you've already added them, maybe consider this plugin
https://wordpress.org/support/view/plugin-reviews/manual-image-crop
That will help you set specific sizes and allow you to manually crop images that are done a bit off.

How do I get multiple rectangular thumbnail sizes in Wordpress?

This may sound like a silly question but I've struggled to find the answer elsewhere.
I'm trying to get a few different (rectangular) sizes of thumbnail on my Wordpress.org homepage. Currently all I get are squares (or sometimes, bizarrely, one or two rectangles and the rest squares).
I'm using this code in <head>:
add_theme_support('post-thumbnails');
...and this in The Loop:
<?php the_post_thumbnail( array(90,60), $attr ); ?>
I've also tried using this in <head>:
add_theme_support('post-thumbnails');
set_post_thumbnail_size( 180, 80, true );
add_image_size( 'worth-reading', 180, 80 );
...and this in The Loop:
<?php the_post_thumbnail( 'worth-reading' ); ?>
With both of these methods I've tried uploading new Featured Images after coding the above in (and also using the Regenerate Thumbnails plugin).
Anyway, the above includes everything I've found on similar forum posts and still none of it seems to work.
Many thanks in advance!
many thanks for your help!
I've done exactly as you said and unfortunately it still doesn't entirely work.
The normal thumbnails are now the correct size but the additional image sizes are just squares with the specified height.
In functions.php:
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 90, 60, true );
// Examples of additional image sizes
add_image_size( 'latest', 120, 100 );
add_image_size( 'worth-reading', 180, 80 );
}
...and at various point in the body:
<?php the_post_thumbnail(); ?>
&
<?php the_post_thumbnail( 'latest' ); ?>
&
<?php the_post_thumbnail( 'worth-reading' ); ?>
Any ideas? Many thanks!
Your code looks right, but enabling the support for featured images and registering sizes needs to be done in your functions.php
So in functions.php add this:
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 180, 80, true ); // default Post Thumbnail dimensions (cropped)
// Examples of additional image sizes
// add_image_size( 'worth-reading', 180, 80 );
}
Since you are setting the default post_thumbnail_size to 180x80 - you probably don't need to register another custom size using the same dimensions but I left an example (commented out) of how you would do it.
In the loop you would use this:
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
Regenerate thumbnails has problems with custom sizes. It will only resize media library items using the sizes defined in the media settings (Settings -> Media). For older posts, I usually just re-upload the image once I add the new size.
Source is all here:
http://codex.wordpress.org/Post_Thumbnails
Something to note about the add_image_size field. The functions works like this:
<?php add_image_size( $name, $width, $height, $crop ); ?>
$name is your custom name, $width is width, $height is height. Crop by default is false (which is how you are using it), which will try it's best to crop / resize the photo. If you set it to true it will hard crop the image without trying to resize it. This is more FYI.
The code you are using SHOULD be working. WordPress only creates the image sizes when you upload the image. Plugins like regenerate thumbnails won't actually create the image size for custom added image sizes.
Did you re-upload the images after moving this code into functions.php?

How do you set only the image width of a Wordpress thumbnail

I am trying to set the width of a post thumbnail using:
the_post_thumbnail()
The width of the image needs to be 210px but the height is not meant to be fixed as all the images will be different sizes. I have tried:
the_post_thumbnail( array( 210, 0 ) )
But this does not work. Any ideas?
Thanks.
Add this inside your functions.php
if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'category-thumb', 210, 9999 ); //210 pixels wide (and unlimited height)
}
Use it inside your theme's template files
<?php if ( has_post_thumbnail() ) { the_post_thumbnail( 'category-thumb' ); } ?>
For default thumbnail add this inside your functions.php
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 150, 9999 ); // default Post Thumbnail dimensions
}
Reference: Here.
Change the_post_thumbnail(array(210,0)) to the_post_thumbnail(array(210,9999))
Open your themes functions.php file and add your image size:
Example:
add_image_size('slider', 525, 339, true);
Breakdown of the code:
'slider'= The name of the new image size (use this when adding the new image size to your template file).
525 = The image width
339 = The image height
true = The image will be cropped to the exact dimensions listed.
Usage:
Use a current template (index.php, single.php, etc.), or create your own. Place this inside the loop (usually just after the_title();) :
the_post_thumbnail('slider');
Now when you add a page or post that uses the template you added the code above, use the featured image option to upload an image. It will output to the size you've created.
Note:
This will only apply to newly uploaded images.
Did you try this : Thumbnail Custom Size
It is the best way to change Thumbnail Size.

Wordpress Custom Featured image size?

I have gone through each of the solutions I've found on here, and still cannot get my 'featured' image to show it's proper size, something continually is forcing it to the wp default 150x110 px.
I have gone into wp/settings/media and changed the thumbnail size... no change
I have gone into the gallery/ featured image and turned off all other sizes except for original... no change
I have gone into my functions.php file and changed the size that is supposedly being called..
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'homepage-thumb' );
set_post_thumbnail_size( 420, 110 ); // default Post Thumbnail dimensions
}
if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'category-thumb', 420, 9999 ); //300 pixels wide (and unlimited height)
add_image_size( 'homepage-thumb',420, 110, true ); //(cropped)
}
In my index file I have ...
<?php if(has_post_thumbnail()) {echo '';echo get_the_post_thumbnail($post->ID, array(420,110) );echo '';} ?>
and still nothing..
When I inspect the element in firebug I see this:
<img class="attachment-420x110 wp-post-image" width="150" height="110" title="t-test2" alt="t-test2" src="http://pixelneer.com/wp-content/uploads/2012/01/t-test2-150x110.png">
SO it is still getting the defualt thunbnail size from somewhere else, and I am at a loss.
I am using starkers, and the URL is pixelneer
When you call up the thumbnail, use the image_size name that you defined earlier. So for example instead of:
get_the_post_thumbnail($post->ID, array(420,110) );
Use:
get_the_post_thumbnail($post->ID, 'home-page-thumb' );
WordPress generates thumbnails only at the time of uploading of the image. Later changes in thumbnail sizes do not automatically apply to existing images.
Try re-uploading your image, or use a plugin like the Ajax Thumbnail rebuilder to rebuild.
You need to specify the size of the image by name when you call it, otherwise it will default to thumbnail size - like this:
<?php if(has_post_thumbnail()) {
echo '<a href="'.get_permalink().'">';
echo get_the_post_thumbnail( 'homepage-thumb' );
echo '</a>';} ?>
Go to your functions.php and look for this code
add_image_size( 'properties', 280, 200, TRUE );
280 is the width and 200 is the height in pixel.
This should solve your problem

Resources