Magento 2 – Gallery Images Broken on Frontend and Page Builder

404magento2media-images

I've got a problem when adding images through the page-builder.
When I open the gallery in the builder I see all images in the image gallery.

When I select the image, I get an broken image because the url changed.

This link is not working:
https://www.elingscraftbeerdrinks.shop/media/.renditions/wysiwyg/Bestellijst.jpg

When I remove the .renditions part, the image is working correctly:
https://www.elingscraftbeerdrinks.shop/media/wysiwyg/Bestellijst.jpg

Does someone know what is causing the problem and how to fix this?

Extra info: All product images are working fine.

Kind regards,
Nick

Best Answer

Could be a permission issue with the .renditions directory.

https://developer.adobe.com/commerce/php/tutorials/backend/modify-image-library-permissions/

"By default, Commerce allows the media gallery access to the following two directories under /pub/media: catalog/category wysiwyg"

Assuming your custom module's structure is under /app/code/Mymodule/Media, here's how you would do it:

Create config.xml: Navigate to the /app/code/Mymodule/Media/etc/ directory.

Add Configuration: Inside the config.xml file, you would add the following XML snippet to extend the "Media Gallery Allowed" folders to '.renditions'

Example config.xml content:

<default>
    <system>
        <media_storage_configuration>
            <allowed_resources>
                <media_gallery_image_folders>
                    <!-- new "Media Gallery Allowed" folders -->
                    <my_image_folder>.renditions</my_image_folder>
                </media_gallery_image_folders>
            </allowed_resources>
        </media_storage_configuration>
    </system>
</default>

<!-- Other existing configuration -->

You'll need to go through the proper steps to make sure your module is properly registered in order for Magento to recognize and use it.

Related Solutions

Magento – Magento 2 – Remove video from gallery in product page

I'm not exactly sure what you're trying to do. Do you want to remove a video from the product? Or only not show it?

Here is my code to remove all product images, you can put a condition in there to remove only the video you want:

/** @var \Magento\Catalog\Model\Product $product */

$gallery = $product->getMediaGalleryEntries();
foreach ($gallery as $key => $entry) {
    $image = $entry->getFile();
    if (your condition) {
        $image = 'pub/media/catalog/product' . $image;
        // Remove entry from Media Gallery
        unset($gallery[$key]);
        // Delete file
        unlink($image);
    }
}
// Save changed media gallery to product     
$product->setMediaGalleryEntries($gallery);
// Save Product
$product = $this->productRepository->save($product);

I hope this helps.

Magento – Product images returning 404 after updating Magento 2

Please make sure to double check owner and group of pub/media directory.

You may run this command from magento root directory:

sudo chown www-data:www-data -R pub/media
find ./pub/media -type d -exec chmod 777 {} \;

Assuming www-data is used as Apache user.

Apache user should have permissions to a pub/media/catalog/product directory to create resized product image files.

Hope it helps.

Best Answer

Related Solutions

Magento – Magento 2 – Remove video from gallery in product page

Magento – Product images returning 404 after updating Magento 2

Related Topic