How to install the Cloudimage plugin for my Magento website?

Savina [Scaleflex]

25 June 2021 11:39

Cloudimage can accelerate your Adobe Commerce (Magento) store in two ways:

Basic implementation → simple configuration change (JPEG optimization, WebP delivery, CDN acceleration)
Advanced implementation → install the Cloudimage module (Basic + responsive images)

Before you start, make sure you have a Cloudimage account.

Basic implementation (simple and fast)

Step 1: Log in to Magento

Step 2: Configure Base URLs

Go to:

Stores → Settings → Configuration → General → Web

Set the following value in both:

Base URL for User Media Files
Secure Base URL for User Media Files

Format:

https://<token>.cloudimg.io/{{secure_base_url}}pub/media/

Example:

https://demo.cloudimg.io/https://sfxmagento.site/pub/media/

Click Save Config when done.

You can also use your own domain (CNAME) instead of {token}.cloudimg.io by contacting support.

Step 3: Flush Magento cache

Go to:

System → Tools → Cache Management

Then flush the cache.

Step 4 : Verify

Check your HTML page source to confirm images are delivered through the CDN.

Advanced implementation (with responsive images)

Step 1: Install the module

Download from Magento Marketplace or from GitHub and install via Composer:

composer config repositories.cloudimage vcs https://github.com/scaleflex/magento-cloudimage-responsive
composer require cloudimage/module-responsive-plugin --sort-packages

Enable the module:

php bin/magento module:enable Cloudimage_Responsive
php bin/magento setup:upgrade

Step 2: Activate the module

In Magento admin:

Stores → Configuration → Cloudimage by Scaleflex → Cloudimage Responsive

Enter your Cloudimage token and enable the module.

Step 3: Configure options (optional)

Available settings include:

The module is fully compatible with the Magento Luma theme.
For custom themes, you may need manual template integration

If you have any questions or issues, please feel free to contact our Software Engineer and mention the following details:

- Token
- Short description of the issue (including URLs, screenshot, short video if available)
- Steps to reproduce the issue.