Did you know you could create different sizes of images (derivatives) automatically within Advantage CSP. There's a couple of great use-cases of when you would want to use this.
Image derivatives, in the context of Advantage CSP, refer to automatically generated variations of an original image. Advantage CSP gives you the ability to create image derivatives to optimize images for different purposes, such as different device resolutions, aspect ratios, or specific display requirements.
Here are some key aspects of image derivatives in a CMS:
Resizing and Scaling: Image derivatives allow users to generate resized versions of an original image to fit specific dimensions or aspect ratios. This ensures that images are properly displayed on different devices and screen sizes without distortion or loss of quality.
Device-Specific Optimization: Advantage CSP can automatically generate image derivatives optimized for specific devices, such as mobile devices or high-resolution displays. This optimization ensures that images are delivered in the most appropriate format and resolution for optimal performance and visual quality.
Image Compression: Advantage CSP offers image compression capabilities as part of the image derivative generation process. Compression reduces the file size of images while maintaining an acceptable level of visual quality. This helps optimize page load times and improve overall website performance.
Caching and Delivery: Advantage CSP can cache generated image derivatives to optimize delivery speed. Once an image derivative is created, it can be stored on a content delivery network (CDN) or within the CMS itself for faster retrieval and delivery to end-users.
Dynamic Generation: In some cases, image derivatives can be generated dynamically on-the-fly when a user requests a specific variation. This allows for more flexibility and eliminates the need to pre-generate all possible derivatives in advance.
The ability to generate image derivatives within the platform simplifies the management and optimization of images for various purposes, such as responsive web design, mobile optimization, or improved website performance. It automates the process of creating and delivering optimized images, allowing CMS users to focus on creating and managing content without the need for manual image manipulation or optimization.
How to Generate Image Derivatives
First you need to create your image derivative sizes within the admin section. If you're not an admin you won't be able to do this.
- Go to Configurations
- Go to System
- Go to Image Configuration
- Click Add or Edit an existing setting
- Enter your settings, then click Save
Now, you'll be able to create your derivatives. Within your post, or page manage at point of upload your image seen below:
After your select and upload your image, click on the drop-down menu for "Size" and then click on the image derivative you. The image will automatically adjust to the size you've set. It's that easy!