We have two methods of integrating ImageEngine with a Magento 2.x site:
- Directly modifying the Base URLs in your Magento 'web' settings.
- Using a plugin that we have created for the purpose of integrating with Magento.
In both cases, to implement ImageEngine’s image optimization for Magento 2.x, you will first need to sign up for an ImageEngine account, if you do not already have one. During the signup process, you’ll be asked for the website domain where you intend to use ImageEngine and the origin URL for the majority of the images. For more information about signing up, please refer to this article: Getting Started: Signup.
Once signed up, you will be issued a unique delivery address following this pattern: “aabbcc.cdn.imgeng.in.” Custom delivery addresses may also be made after the initial signup process is complete. For more information, see our article here.
Take note of your delivery address, as it will be needed for both of the suggested deployment methods.
Note: Regardless of method, upon completion of integration with Magento, your Magento site's images will be using the ImageEngine delivery address. The Original images are still available - The integration has simply rewritten the image URLs to use the specified ImageEngine Delivery address.
Base Media URL modification method:
- In the Admin Panel click the “Stores” and under the Settings category click “Configuration.”
In the General settings click on the “Web” section.
Open up the “Base URLs” settings.
Modify the “Base URL for User Media Files” to use your ImageEngine Delivery Address. Remember to append the Magento
media/directory to the end of the domain name:
Important: Perform the same operation in "Base URL for User Media Files" in the “Base URLs (Secure)” section.
Note: You must make this change to “Base URLs (Secure)” if you are serving HTTPS traffic
Save your Configuration.
It is strongly recommended that the Catalog and Page Caches are flushed to ensure that the old image URLs are not still represented. Please ensure this step is completed if the Implementation appears to be unsuccessful.
To perform the cache flush, navigate to System->Cache Management.
- Check the "Page Cache" box
- Click "Flush Catalog Images Cache"
- Click "Flush Magento Cache"
- Once finished, verify that images are being served by ImageEngine.
Installation using Composer
The ImageEngine Magento module is available on pagagist.org and can be installed using composer:
# Install the module with Composer
composer require scientiamobile/module-magento2-image-cdn-imageengine
# Enable the module
magento module:enable scientiamobile/module-magento2-image-cdn-imageengine
|Please pay attention to the supported PHP versions:
Go to Stores in the application menu and select Configuration:
You should see tab labeled "ScientiaMobile" on the left.
Log into your ImageEngine account via control.imageengine.io to access your account dashboard. Copy the “Delivery Address” from the Engines table.
Going back to the plugin settings in Magento, paste the ImageEngine Delivery Address into the “ImageEngine media URL” field. Be sure to include http:// or https:// in front of the Delivery Address.
This configuration will change the secure and non-secure base media URL in the Magento settings. Note that the module will automatically append the
media/path to the provided domain name.
Enable the module globally.
Save the configuration.
ImageEngine is now configured. Verify that images are loaded from the Delivery Address pasted into the ImageEngine media URL field.
You can fine-tune the image delivery in the ImageEngine control panel.