I am having trouble calling the featured image of the blog post in my wordpress blog. I have searched websites for the tutorial but it all leads to the same results.
It doesn't follow my assigned size which is 200x180px then the rest is cropped. to have a better view of what i'm trying to do, you can refer to this website:
http://freakify.com/
I am trying to have all the featured images in same sizes (200x180). on a very related topic, the sizes of my featured images is different but not lower than 500px and not more than 650px. I am trying to display it in different places such as my index file and side bar.php file
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 200, 180, true ); // 50 pixels wide by 50 pixels tall, crop mode
add_image_size( 'post-thumbnails', 200, 180 );
I hope you can help me guys.
First, you dont need the add_image_size if you're going to use only a one thumbnail image size, only with the first two lines es enough.
Second, with the 'true' statement you are 'telling' wordpress to hard crop the images, so it just cuts down the image to make them 200x180. On the other way, if you change the 'true' to 'false', then your images will be resized to the maximum width or height they can reach maintaining the aspect ratio.
This are the two methods for resizing the images without changing their appearence, because if you don't mantain the aspect ratio, you'll have stretched images.
My recommendation is to use the 200px as an absolute value, and change the height dynamically.
To achieve this you can do this:
set_post_thumbnail_size( 200, 9999, false );
This way you can have your original images, filling the 200px requirements but not changing their height, so you could preserve the aspect ratio.
Look at http://dfine.me to see this in action, you just need to modify the css to get the items in a proper way.
Related
We created a custom theme using ACF for Wordpress. Our issue is that we are resizing a single image 1440 x 320 to fit in 2 places. The first place which is working fine is Full post leadspace image which uses the full 1440 x 320 image. The issue we are having is for the Featured post view or Card layout the image needs to resize down to 380 w x 160 H. We are using Advanced Custom fields to add the image to the post. I will attach a photo of whats happening
I guess the problem isn't ACF, but your add_image_size() function.
If you already defined the image size in your functions.php, it should look like this:
add_image_size ( "card", 380, 160, true );
The last argument (true), tells WordPress to crop the image. If this is set to false, the resized image will be 380px wide and the height will be proportionally. If you crop the image, WordPress will first resize the image, and then cut the image to 380x160px
http://cameleonjackets.com/product-category/fall-2014/
The models heads are being cut off. How can I align the photo to the top? I've tried adjusting the photo sizes and the columns, but I want to keep the layout and product images as is. Is there a way to do this with CSS? Thanks!
The issue isn't with CSS. It's with the fact that your CMS is cropping the images, and doing so from the center of your images.
First you need to disable cropping on your generated thumbnails. Settings in wordpress will be found at
Dashboard > settings > media
and (depending on your installation of woocommerce)
Dashboard > Woocommerce > Settings > Product > Product Image Sizes
You will also need to disable cropping anywhere in your themes code that could be causing problems. Look for functions that look the similar to
add_image_size( $name, $width, $height, $crop );
Where $crop would be a true false statement that we want to be false.
Then you will need to have your thumbnails regenerated.
You can use this plugin to do that.
Then you can use css to set the size of whatever wraps your images as well as set overflow:hidden and then set the image styles min-width and min-height to 100%. That way if you upload different sized images it still appears to be properly cropped.
I am having a bit of trouble with an unfamiliar wordpress theme. My featured images are all 870 x 550 and yet when i put them in they are resized to 870 x 490, with an ugly crop. I have found a couple of CSS entries with a value of 490px so I changed them to 550px (see code snippet).
div.featured-media-container {width:870px; height:550px;}
div.featured-media-container img {width:870px; height:550px;}
This has made the container the right size, and resized my image to fill it, but the crop still remains so the image is stretched. How do I stop them being cropped when I drop them in?
Thanks.
Oh, here's the page in question: http://www.decentdesign.co.uk/portfolio/east-wing-coffee/
You Just DO one thing from your wp admin panel
go to settings > Media
and change the size according to your nedd. For reference take a look of below attached image
that's it Very Simple
I'm developing a WordPress theme, and I need images that are uploaded via the inbuilt Media Uploader, to be the same ratio. I know this is easily done by defining the height and width and using crop.
Problem is that I want to use these images for a fullscreen slider, so having all images down to 300x200 as an example wouldn't work. I want to keep as much as the default size of the image as possible while cropping it for the ratio.
WordPress comes with a add_image_size() feature, but I'm more like looking for a add_image_ratio() feature. Is this even possible?
You can use a ratio:
$thubmnail_ratio = (150 / 200); // height to width ratio, you can use some existing working ratio
add_image_size( 'thumbnail-small', 100, round(100*$thubmnail_ratio), true );
add_image_size( 'thumbnail-medium', 200, round(200*$thubmnail_ratio), true );
add_image_size( 'thumbnail-large', 400, round(400*$thubmnail_ratio), true );
It should also be possible writing a little helper function that wraps add_image_size(...).
I'm working on WordPress site where it's important to have images sit on a baseline grid of 18px, where total image dimensions are always multiples of 18px, with the height cropped by an extra 8px. This is mostly a layout thing and to have images play nicely with text.
I am trying to figure out how to hook into WP/GD functionality where:
Image is resized as normal (thumbnail, medium, large), setting max width only in WP admin.
The image height is (math, round?) cropped to the closest multiple value of X (in this case 18px).
Using the new height, crop again by subtracting another X value of the height (in this case 8px).
The end result would ideally be a plugin where values can be activated and edited for individual users in a multi-site environment.
i'm seeking the same behavior for a website. I found several plugins http://wordpress.org/extend/plugins/resize-at-upload/ or http://wordpress.org/extend/plugins/resize-on-upload/ which show that we can add an action to "wp_handle_upload".
I dig this way !