New to the community? Start here

[Smush Pro] Using WP Smush together with Crop-Thumbnails plugin

Hello, 

I’m trying to use WP Smush Pro together with Crop-Thumbnails plugin (or basically any other plugin capable to crop thumbnails) and it does not work. Well it does but the cropped images are not displayed. 

I’m almost sure it’s because of WEBP conversion. That of course makes sense. I upload the image, it’s optimized and converted to WEBP by WP Smush. Than I adjust thumbnail sizes with crop plugin, there are successfully saved (checked) but WEBP images stil stay the same so displayed images on the site do not change. 

Is there please any way to regenerate already generated WEBP images for single image? It should simply current version of the original thumbnails and convert it again. I think that should work. But I don’t find such an option anywhere in Smush plugin.

Thanks a lot, Jakub

Sat, 19 Aug 2023 6:28:08
More Smush Pro discussions
Smush Pro
  • Nebu John
    • FLS

    Hi Jakub ,

    Trust you are doing good and thank you for reaching out to us.

    Could you please try re-checking the image files at WP Dashboard >> Smush Pro >> Bulk Smush and try re-smushing the image files?

    [attachments are only viewable by logged-in members]

    Since support access to your site is disabled at the moment, I wasn’t able to give a closer look at the issue. If the issue still persists, could you please grant support staff access so that we could give a closer look?

    You can grant access from WPMU DEV >> Support >> Support Access >> Grant Access, or check this manual: https://wpmudev.com/docs/getting-started/getting-support/#enabling-support-access

    Please let us know once you enable access so that we could get this sorted.

    Kind Regards,
    Nebu John

  • Jakub
    • Site Builder, Child of Zeus

    Hello Nebu John ,

    thanks for your answer. I just tried it but with no luck. It showed me two images for re-smush but I don’t think they were the ones with changed thumbnails. I have enabled support access.

    You can see the image that should be changed here:
    https://ito.znackarna.dev/wp-content/uploads/2023/08/FialovaVyzva2023-500×254.png

    When downloaded from FTP, it’s correctly changed (attached here) but not on the site…

    Thanks, Jakub

  • Katharina Cerny
    • Ex Staff

    Hi Jakub

    Thanks for the additional details and support access.

    I checked this and noted that the Crop-Thumbnails plugin doesn’t change the file name of the cropped file. This means that Smush has no way of determining that the cropped thumbnail(s) need to be re-smushed and converted to webp. When you crop an image through WordPress, it will change the file name so that this would not be an issue.

    However, the webp version of the original thumbnail (before cropping) should still exist but seems to be missing as well. Did you remove it manually? It should be in /wp-content/smush-webp/2023/08/FialovaVyzva2023-500×254.png.webp. This is also the reason why you can download https://ito.znackarna.dev/wp-content/uploads/2023/08/FialovaVyzva2023-500×254.png from FTP but it gives a 404 error on your site, because Smush Local WebP server rules will redirect the URL to the .webp version which doesn’t exist.

    To get the image to convert to webp one thing you can try is to delete all webp files in Smush > Local WebP > Revert WebP Conversion. This will remove all webp files and the original images will be served. Then you can run Bulk Smush, re-check images and smush again to create the webp files, including the cropped thumbnail(s).

    Another thing to try would be to only delete this specific image from the Media Library, disable the Automatic compression in Smush > Bulk Smush and upload the image again. Then crop the thumbnail and run the image re-check in Bulk Smush. It should pick up the new image and thumbnails. And when you bulk smush them, it should convert the cropped thumbnails to webp correctly.

    If you will crop thumbnails like this more often, I recommend that you leave the Automatic compression option disabled and run a manual bulk smush after cropping.

    Please let us know if this works for you.

    Best regards,
    Katharina

  • Jakub
    • Site Builder, Child of Zeus

    Hello Katharina Cerny ,

    thanks for your answer. I understand that there isn’t an easy way to find out that the original image was changed. However both suggested approaches are quite complicated. The idea is that client will be “re-cropping” uploaded images (or their thumbnails respectively) quite often.

    So it would be great to have some faster option. I asked the plugin author and he posted a link to the extension for another WebP conversion plugin. His entire answer is here. The extension itself seems to be very simple. It just says to the WEBP plugin that it should regenerate WEBP files.

    Is there some similar action for the WP Smush Pro plugin? I did not find any in the docs.

    Thanks a lot, Jakub

  • Abdoljabbar
    • Staff

    Hello Jakub ,

    Thanks for your patience. I apologize for the delay.

    Based on the extension you provided, here is a snippet of code that you can use as a mu-plugin:

    <?php
/**
 * Plugin Name: Smush Pro WebP fix while using Crop thumnails plugin.
 * Description: Converts cropped images by Crop thumbnails plugin to WebP format using Smush Pro.
 * Jira: 5231
 * Author: Abdoljabbar Bakhshande
 * Author URI: https://wpmudev.com
 * License: GPLv2 or later
 *
 * @package WordPress
 */

// If this file is called directly, abort.
if ( ! defined( 'WPINC' ) ) {
	die;
}

/**
 * Converts cropped image to WebP format using Smush Pro.
 *
 * @param string $file_path The file path of the cropped image.
 */
function smush_convert_to_webp_after_crop( $file_path ) {
	// Check if the file exists.
	if ( ! file_exists( $file_path ) ) {
		return;
	}

	// Get the instance of the Smush's WebP class.
	$webp_instance = WP_Smush::get_instance()->core()->mod->webp;

	// Get the attachment ID from the file path.
	$attachment_id = attachment_url_to_postid( $file_path );

	// Check if the attachment ID is valid.
	if ( ! $attachment_id ) {
		return;
	}

	// Get the attachment metadata.
	$meta = wp_get_attachment_metadata( $attachment_id );

	// Convert the image to WebP.
	$webp_instance->convert_to_webp( $attachment_id, $meta );
}

// Hook into the 'crop_thumbnails_after_save_new_thumb' action.
add_action( 'crop_thumbnails_after_save_new_thumb', 'smush_convert_to_webp_after_crop', 10, 1 );

    f you’re not familiar with mu-plugins, you can learn more here:

    https://wpmudev.com/docs/using-wordpress/installing-wordpress-plugins/#installing-mu-plugins

    Please let me know if you need any further assistance.

    Regards,
    Abdoljabbar

  • Jakub
    • Site Builder, Child of Zeus

    Hello Abdoljabbar ,

    thanks a lot. I added the MU plugin but I’m actually not sure it is doing everything :(. I have changed all image sizes with Crop-Thumbnails plugin, they are changed successfully (I checked it in uploads folder) but WEBP images are still staying the same. I also tried to re-check images to smush but changed one is not there. I have no idea how to debug this to be honest :(.

  • Nebu John
    • FLS

    Hi Jakub ,

    Sorry to know that the workaround is not working as expected.

    Can you please create a new admin account with the contact+delegate@wpmudev.com email and provide the login details to us along with FTP or cPanel using our Direct Contact Form feature in the ticket for us to be able to check things further? Also, go to WPMU DEV >> Settings >> Permissions panel and add this new user there as well.

    You can then share these needed details for the site via the Direct Contact Form feature on the right side of this ticket. Please see this URL to know more and serve as a guide: https://wpmudev.com/docs/getting-started/getting-support/#support-tickets-additional-details

    We look forward to hearing back from you.

    Kind Regards,
    Nebu John