Order Item Images for Magento 2

Avenyra Order Item Images

A Magento 2 module that captures and stores product thumbnail images for order items, making them available in the admin panel on order view page and via GraphQL for headless storefronts.

Features

• Automatic Image Capture: Automatically captures product thumbnail URLs when orders are placed
• Admin Panel Display: Shows product thumbnails in the order view page for better visual identification
• GraphQL Support: Exposes thumbnail URLs via GraphQL for headless commerce implementations
• Configurable Product Support: Intelligently selects child product images for configurable products
• Database Storage: Stores thumbnail URLs in the database to preserve historical product images
• Placeholder Fallback: Automatically uses placeholder images when product images are unavailable

Requirements

• PHP 8.1+
• Magento 2.4.5+

Installation

Via Composer (Recommended)

composer require avenyra/module-order-item-images
php bin/magento module:enable Avenyra_OrderItemImages
php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy
php bin/magento cache:flush

How It Works

Order Placement

When a customer completes checkout, the module:

1. Captures the product thumbnail URL for each order item
2. For configurable products, uses the selected variant's image
3. Stores the thumbnail URL in the database table
4. Falls back to placeholder images if product images are unavailable

Admin Panel

The module enhances the order view page by:

• Adding a "Thumbnail" column to the order items grid
• Displaying product images (90px height) for visual identification

ScreenShots

Configurable Products

Simple & Bundle Products

Placeholder Images

GraphQL API

The module extends the OrderItemInterface with:

• item_thumbnail_url field for retrieving product thumbnails
• Automatic placeholder fallback for missing images
• Full compatibility with headless storefronts

GraphQL Usage

Query Example

{
    customer {
        orders {
            items {
                items {
                    product_name
                    product_sku
                    item_thumbnail_url
                    quantity_ordered
                }
            }
        }
    }
}

Response Example

{
    "data": {
        "customer": {
            "orders": {
                "items": [
                    {
                        "items": [
                            {
                                "product_name": "Sample Product",
                                "product_sku": "SAMPLE-SKU",
                                "item_thumbnail_url": "https://example.com/media/catalog/product/cache/.../image.jpg",
                                "quantity_ordered": 2
                            }
                        ]
                    }
                ]
            }
        }
    }
}

Support

Found a bug or issue? Please open an issue on GitHub.

Author

Avenyra Solutions