The latest version of PictureRenderer has support for resizing and optimizing images using Cloudflare's image service.
Optimizely CMS
On-page editing with Optimizely CMS on an externally hosted site
Did you know that you can enable on-page editing for a site that isn't hosted on the same server as the CMS? I'm not sure when this feature was introduced, as there isn't much documentation available. It took me several hours to figure out all the necessary steps. Hopefully, this article will save you some … Continue reading On-page editing with Optimizely CMS on an externally hosted site
Optimize images added in the rich text editor.
PictureRenderer for Optimizely CMS can be used to optimize images added in the rich text editor (TinyMce). In PictureRenderer.Optimizely v2.3 an XhtmlString extension is added that replaces img elements in the rich text content with a picture element. You enable this by creating a display template for XhtmlString properties. Create the file /Views/Shared/DisplayTemplates/XhtmlString.cshtml and add this: @using … Continue reading Optimize images added in the rich text editor.
Optimize images on your Optimizely CMS site
You want the images on your site to be lazy loaded in the most optimal size and format, and still look really sharp on all devices. You don't want the content editor to have to care about image size, image format, or what proportions the image should have. PictureRenderer can help you with all of … Continue reading Optimize images on your Optimizely CMS site
Updates for Optimizely CMS 11 Picture helper
The Picture helper for Optimizely CMS 11 now supports creating webp versions for "all" image formats. Up until now webp versions was only created for jpg images. The reason was that the webp versions where lossy. The webp versions of a png image would get grainy/blurry parts, instead of the solid colors in the original … Continue reading Updates for Optimizely CMS 11 Picture helper
PictureRenderer for Optimizely CMS 12
Say hello to PictureRenderer.Optimizely! The html helper that makes it super simple to render HTML Picture elements in your Optimizely CMS 12 solution. Images are automatically cropped and resized, and the browser will always select the most optimal image to use.The result is optimized (width, format, and quality), lazy loaded, and responsive images. If you … Continue reading PictureRenderer for Optimizely CMS 12
Serve Optimizely CMS pages directly from a CDN.
This blog post is about speeding up your site by caching your Episerver Optimizely CMS pages in a CDN. This solution gives you granular control on how long a specific page should be cached. It works for any CDN, but here I'm focusing on getting it to work with the Cloudflare CDN that is included … Continue reading Serve Optimizely CMS pages directly from a CDN.
Getting started with Optimizely CMS preview
UPDATE: The process for creating a new CMS project is now very different from described below. Check the latest documentation here. This is my experience on how to get started with the preview version of Optimizely CMS. Expect this blog post to be outdated fairly soon... Finally I took the time to take a look … Continue reading Getting started with Optimizely CMS preview
Control the cropping of your images with a focal point
The Image point editor for Optimizely/Episerver CMS can be used together with the Picture helpers in PictureRenderer.Optimizely or ImageProcessor.Web.Episerver to control the cropping of images. If showing the same image in different height and width on your site, you might want to control how the image is cropped. Let's say you are showing super cool, … Continue reading Control the cropping of your images with a focal point