Carousel slider image sizes

Hi kkriss,

Alex from SiteOrigin here. ??

Currently, it’s not directly possible to do this via widget settings. We’re looking to improve the functionality of this in the future to allow for this though.

You can however do this with a few modifications (CSS and a plugin).

To start with, we’ll need to adjust the image sizes themselves. As these images are set via an image size (it’s a WordPress feature) we’ll need to use a plugin to adjust it.

Please download and install this plugin. To install a plugin manually please navigate to WP Admin > Plugins > Add New and click Upload Plugin. This plugin is a short plugin that will adjust the image crop to your desired sizing for images. Once you’ve done that you’ll need to regenerate your images, this can be done via the excellent Regenerate Thumbnails plugin. Once you’ve done that you can remove the regenerate thumbnails plugin.

Then we’ll need to add CSS to make adjustments to the frontend. If you haven’t already installed one, you’ll need a CSS editor. We recommend the SiteOrigin CSS plugin. ?? Once installed please navigate to WP Admin > Appearance > Custom CSS and add the following CSS:

.sow-carousel-thumbnail a, .sow-carousel-thumbnail a span.overlay {
	width: 192px !important;
	height: 290px !important;
}

.sow-carousel-item {
	width: 192px !important;
}

Let me know if this works for you.

Hi Alexgso.
Thanx for your answer. Before installing the first plugin you suggested I would like to understand better what it does, because I will need to upload continuously new images 192 x 290 or maybe larger or smaller, don’t know actually how the site will change. They are books, so the client wants to show them as soon as they are published. Hope that all you suggested don’t change any other image size as each of them is used for some specific function. Think that the size option for carousel is necessary for all the users as it’s impossible that one can use always the same size. I uploaded the feature image of 192 x 190 expressly to fit the carousel, but it crops the feature image too, so can’t do nothing more. Please help, it was simply what I need but with the right sizes, I don’t want to slow the site using another plugin and all plugins for sliding custom posts are premium plugins. Thank you so much.

Hi kkriss,

The plugin code is very simple and lightweight. Here’s the entire code (outside of the plugin header):

function so_no_crop(){
	remove_image_size( 'sow-carousel-default' );
	add_image_size( 'sow-carousel-default', 192, 290, false );
}
add_action( 'init', 'so_no_crop', 50 );

It simply removes the default sizing for the carousel (which is only used by that – meaning nothing else will be affected) and adds the sizing you’ve specified in the screenshot. It, sadly, cannot support images at different dimensions but it will resize the image down to 192×290 so if you use larger images (with a similar aspect ratio) you’ll be fine.

I know this is odd and not very simple. We agree and it’s definitely something we’re looking to improve in the future.

Hi Alexgso.
Tried what you suggested but no luck. see here I tried first to add the plugin, css (my child css, ok?) and regenerating thumbs. Then tried deleting old images and uploading them in the Media again. As you can see, the images are repeated for the part exceeding the original SO Carousel space. The first screenshot was taken when I deleted the old images ad maybe it can be useful for you to understand what the function does. Ideas?

is there a resolution (pun intended)?
is there a better way to use disparate images for the carousel?
-thanks