Image Manager Pro
Welcome to the ultimate file and image management solution for OpenCart 3. Image Manager Pro completely replaces the default, outdated OpenCart file manager with a modern, high-performance, and feature-rich interface.
Built with Lazy Loading, AJAX Live Search, and a Built-in Image Editor, this extension is designed to handle thousands of images smoothly while providing desktop-like file operations (Drag & Drop, Multi-select, Copy, Paste, Duplicate).
1. Installation Guide
- Log in to your OpenCart Admin Panel.
- Go to Extensions > Installer.
- Click the Upload button and select the
image_manager_pro.ocmod.zipfile. - Wait until the success message appears.
- Go to Extensions > Modifications and click the light blue Refresh button at the top right.
- Go to Extensions > Extensions, select Modules from the dropdown.
- Find Image Manager Pro and click the green Install button.
2. Configuration
After installation, click the Edit button next to Image Manager Pro in the Modules list to configure the settings.
Image Optimization Settings
- Status: Enable or disable the extension globally.
- WebP Support: Automatically convert uploaded JPG/PNG files to the modern, ultra-lightweight WebP format.
- Compress Image: Apply automatic compression algorithms during upload to reduce file sizes without losing noticeable quality.
Watermark Settings
- Enable Watermark: Automatically stamp your images during upload.
- Watermark Type: Choose between using your Store Name dynamically or a Custom Text.
- Watermark Position: Choose where the watermark should appear (Top Left, Bottom Right, Center, etc.).
3. Core Features & Usage
Admin Header Shortcut
You can now access the Image Manager from anywhere in the admin panel! Look for the icon in the top right header (next to your profile). This opens the manager as a standalone popup.
File Operations & Context Menu Updated
- Drag & Drop: Simply drag files from your computer and drop them into the Image Manager window to upload instantly.
- Multi-Select: Hold
Ctrl(Windows) orCmd(Mac) and click multiple images to select them simultaneously. - Context Menu: Right-click on any image or folder to reveal options like Rename, Edit, Copy, Cut, Delete, Get Link, and Download.
- Duplicate: Select an image and click the Duplicate icon () on the toolbar to instantly clone it (e.g.,
image-COPY.jpg).
Image Info & Usage Tracking (List View) New
Switch to List View to see advanced details about your images:
- Dimensions: Instantly view the width and height of your images without opening them.
- "Used By" Tracking: See exactly which products, categories, manufacturers, or banners are using an image.
- Note: If an image shows as "Not used in Core", please ensure it is not being used by third-party extensions (like Blog or Gallery modules) before deleting it.
Duplicate Detection & Storage Optimization New
Save valuable server space by finding and removing identical images. Click the Find Duplicates button () in the header. The system scans your entire media library using file hashes and groups identical images together, allowing you to easily delete the redundant copies.
Recycle Bin / Trash System New
Never accidentally delete an important image again! Deleted images are now moved to the Recycle Bin instead of being permanently destroyed.
- Click the Recycle Bin button () in the header to view deleted items.
- Restore: Recover accidentally deleted images back to their original folders.
- Empty Trash: Permanently delete items when you are sure you no longer need them to free up space.
Bulk Add to Product Form
When editing a product, you no longer need to add "Additional Images" one by one. Click on an image placeholder to open the manager, multi-select several images, and click the green Bulk Add button. All selected images will instantly populate the product form rows!
State Memory
The manager remembers your preferences! If you close the manager and reopen it, it will remember your last visited directory, your current page number, your view mode (Grid/List), and your "Items per page" limit.
4. Built-in Image Editor
We integrated the powerful Toast UI Image Editor directly into your dashboard.
How to use:
- Right-click on any image and select Edit Image.
- A full-screen dark-themed editor will open.
- Use the bottom toolbar to Crop, Flip, Rotate, Draw, add Shapes, Icons, Text, or apply Instagram-like Filters.
- Click the green Save to Server button at the top right.
- The image is instantly overwritten on your server, and the Image Manager automatically refreshes the thumbnail using a cache-buster technique!
5. Performance Optimization
Lazy Loading
The default OpenCart manager crashes when opening folders with 1,000+ images. Image Manager Pro solves this with Intersection Observer Lazy Loading. Images are only downloaded when you scroll them into view, making folder navigation lightning fast.
Live AJAX Search
Type in the search box and the results will filter instantly in real-time (with a 500ms debounce to prevent server overload). No need to press enter or click search.
File Type Filtering
Use the dropdown next to the search bar to instantly filter the view to show only Folders, JPG, PNG, or WEBP files.
Clear Image Cache
Click the orange Clear Image Cache button in the header of the manager to safely flush OpenCart's image/cache/ directory. This is incredibly useful when you replace images but OpenCart stubbornly shows the old thumbnails.
6. Troubleshooting & Support
- Changes not showing up? Make sure you have cleared both the Theme/SASS cache (Dashboard gear icon) and clicked the Refresh button in Extensions > Modifications.
- Cannot upload large files? Check your server's
php.inisettings forupload_max_filesizeandpost_max_size. - Watermark looks too small/big? The watermark size is dynamically calculated based on the image dimensions (approx 30% of image width). It scales perfectly regardless of the original image size.
Need Help?
If you have any questions or encounter any issues after purchasing, please don't hesitate to contact us at info@kajokul.com.
Thank you for purchasing Image Manager Pro!