LogoLogo
BlogHelp CenterPrivacyLoginRegister
  • Let's optimize your images
  • Transformations
    • Input formats
    • Image operations
      • Width and height
      • Prevent enlargement
      • Crop
        • Automatic gravity crop
        • Positionable crop
        • Focal point crop
        • Face crop
        • Face hide
        • Aspect ratio crop
      • Fit
      • Cropfit
      • Bound
      • Boundmin
      • Cover
      • Device pixel ratio
      • Flip
      • Rotate
      • Trim
      • Rounded corners
      • Background removal
    • Image filters
      • Adjustment
        • Brightness
        • Contrast
        • Saturate
      • Color manipulation
        • Color overlay
        • Grayscale
        • Duotone
        • Sepia
        • Invert
      • Blur
      • Pixelate
      • Sharpen
      • Face blur
    • Image watermarking
      • Static watermark
      • Dynamic watermark
      • Text watermark
        • Text watermark fonts
    • Image compression
      • Image formats
      • Optipress
      • SVG compression
      • Color management
    • Static content
      • PDF to image
      • JS/CSS optimization
    • Video operations
  • Setup
    • Shortening URLs
      • Origin URL prefix
      • Aliases
      • Presets
      • Rules
    • Connecting storage bucket
      • Amazon S3
      • Google Cloud Storage
      • Microsoft Azure Blob
      • Basic authentication HTTP
    • Security
      • Token security
        • Domain whitelisting
        • URL signature
        • URL sealing
      • Account security
      • Origin security
  • Implementation
    • URL API implementation
    • Responsive images JS plugin
    • CMS plugins
      • Spryker
      • Drupal
      • Kontent.ai
      • Contentful
      • Adobe Commerce (Magento)
        • Basic implementation
        • Advanced implementation
      • Opencart
      • Prestashop
        • Prestashop tutorial
      • Shopware
      • Sylius
      • Wordpress
      • Shopify tutorial
        • Shopify integration
        • Theme files
        • FAQ
      • Commercetools tutorial
      • Ruby wrapper
    • Migrating from another image CDN
  • Caching and acceleration
    • CDN basics
    • Caching interval
    • Invalidation API
    • Warmup API
  • Analytics
    • Dashboards
      • Overview
      • Volumetry
      • Optimization
      • Delivery
      • Top-Ranking
      • RUM
      • Logs API
  • Cloudimage_v6 EOL
Powered by GitBook
LogoLogo

Resources

  • Help center
  • Contact support
  • Developers
  • cloudimage.io

Solutions

  • Media optimization
  • DAM
  • Performance report

Company

  • Blog
  • Service status
  • About us

Legal stuff

  • Terms & conditions
  • Privacy center
  • DMCA

Copyright © 2023 Scaleflex

On this page
  • Prerequisites
  • Step 1. Login to Magento
  • Step 2. Configure the plugin
  • Step 3. Flush the cache of Magento
  • Verify your HTML page source

Was this helpful?

Export as PDF
  1. Implementation
  2. CMS plugins
  3. Adobe Commerce (Magento)

Basic implementation

Magento simple implementation

PreviousAdobe Commerce (Magento)NextAdvanced implementation

Last updated 7 months ago

Was this helpful?

This simple and fast implementation in Magento 2 enables JPEG optimization, WebP compression and CDN delivery of your images.

Prerequisites

To use the plugin, you need to have a Cloudimage account. You can create one on the .

Step 1. Login to Magento

First, you need to log in to your Magento 2 website admin

Step 2. Configure the plugin

On the Admin sidebar, go to Stores > Settings > Configuration.

Navigate to the settings page - from the left panel, in the General group, choose Web.

Then, you need to set up the Base URLs.

It is important to set this prefix in both - Base URL for User Media Files and Secure Base URL for User Media Files.

In Base URL for User Media Files in Base URLs and Base URLs (Secure) add the following value, replacing your token: https://<token>.cloudimg.io/{{secure_base_url}}pub/media/

For example, if your website is https://sfxmagento.site, and your token is demo, the final URL address should be: https://demo.cloudimg.io/https://sfxmagento.site/pub/media/

When complete, do not forget to click Save Config.

Step 3. Flush the cache of Magento

On the Admin sidebar, go to System > Tools > Cache Management and Flush the cache of Magento.

Verify your HTML page source

Please ensure that you are properly delivering static content via the CDN.

You can now modify your template to resize your images with us.

You can also use your own domain instead of {token}.cloudmg.io via CNAME records. Please and an engineer will help setting it up.

Magento’s cache management system is an easy way to improve the performance of your site. Whenever a cache needs to be refreshed, a notice appears at the top of the workspace to guide you through the process. Find additional information and tips in this .

contact us
Magento tutorial for cache management
Cloudimage registration page