Optimizely blog by ted&gustaf

Adaptive Images with Optimizely CMP

ted@tedgustaf.com — Thu, 27 Feb 2025 07:00:15 Z

Images from Optimizely CMP can now be seamlessly integrated into Optimizely CMS through Adaptive Images, with the all same features that web editors and developers have come to love.

Blazor in Optimizely CMS 12 with .NET 8

ted@tedgustaf.com — Thu, 30 May 2024 09:36:01 Z

How to enable support for Blazor components in Optimizely CMS 12 after upgrading to .NET 8.

Render more breakpoints with Adaptive Images

ted@tedgustaf.com — Thu, 09 Nov 2023 06:00:10 Z

Adaptive Images only renders three different image sizes for responsive images by default, but you can easily roll your own HTML. Here is an example of how an image can be rendered in multiple sizes for any number of breakpoints.

Cloudflare for image resizing in Optimizely DXP

ted@tedgustaf.com — Mon, 23 Oct 2023 13:24:26 Z

Optimizely DXP supports Cloudflare for image transformation and optimization at the edge. Adaptive Images supports this out-of-the-box, making it dead simple to use.

Free feature flagging in Optimizely

ted@tedgustaf.com — Thu, 22 Sep 2022 06:00:11 Z

Feature flagging in Optimizely allows gradual rollout of new features, or performing A/B/n tests, without need for deploying new code.

Changes to serialization of PropertyList items in Adaptive Images for Optimizely

ted@tedgustaf.com — Wed, 07 Sep 2022 06:00:11 Z

If you use the AdaptiveImageConverter or SingleImageConverter JSON converters for PropertyList properties, you need to make some minor changes to avoid errors when adding or editing items.

Adding custom TinyMCE plugins to the HTML editor in Optimizely CMS

ted@tedgustaf.com — Thu, 03 Mar 2022 08:00:04 Z

TinyMCE plugins allow you to extend the HTML editor in Optimizely CMS. In this example we'll look at adding a custom button to TinyMCE for formatting text with the element.

Adaptive Images update for Optimizely CMS 12

ted@tedgustaf.com — Tue, 01 Mar 2022 08:33:07 Z

A summary of what's new in the major update for Adaptive Images released for Optimizely CMS 12.

Google Maps Editor for Optimizely CMS 12

ted@tedgustaf.com — Sun, 20 Feb 2022 19:00:00 Z

The Google Maps editor has been updated for Optimizely CMS 12, making it easier than ever for editors to use an interactive map to specify map coordinates.

Rendering Adaptive Images in Episerver

ted@tedgustaf.com — Mon, 29 Jun 2020 15:08:39 Z

Examples of how images can be rendered to fit different designs and requirements when using the Adaptive Images add-on for Episerver.

Using Adaptive Images for Episerver with Cloudinary

ted@tedgustaf.com — Wed, 27 May 2020 14:32:00 Z

The Adaptive Images add-on for Episerver is designed to work with Cloudinary for image transformation, optimization, and delivery. In this post we'll look at how you can set up Adaptive Images to work with your Cloudinary account.

Introduction to Adaptive Images for Episerver

ted@tedgustaf.com — Tue, 04 Feb 2020 14:09:32 Z

Developer introduction to Episerver Adaptive Images, an add-on for responsive and adaptive images in Episerver with one or more image services or DAMs integrated.

Episerver Google Maps editor update

ted@tedgustaf.com — Wed, 26 Sep 2018 08:05:19 Z

The Google Maps editor for Episerver has been updated to allow developers to customize settings such as API key, default zoom level and coordinates.

Episerver on-page edit with JavaScript frameworks

ted@tedgustaf.com — Tue, 04 Jul 2017 06:00:00 Z

JavaScript frameworks such as Angular, React, and Aurelia, are powerful for creating engaging and interactive websites. However, these frameworks tend to want to own the HTML DOM, which may have an adverse affect on the on-page editing features in Episerver. In this post we look at how that can be fixed.

Zero Downtime Deployment of Episerver

ted@tedgustaf.com — Tue, 21 Feb 2017 19:00:00 Z

How do we deploy a website continuously, without any anxiety, downtime, or degraded performance? This post outlines the tools and processes we use to accomplish zero downtime deployments of Episerver websites.

Upgrade to Episerver 10

ted@tedgustaf.com — Fri, 04 Nov 2016 16:11:30 Z

Episerver recently released a major version update, which comes with a few breaking changes that need to be addressed when upgrading to Episerver CMS 10.

Custom markdown editor for string properties in Episerver

ted@tedgustaf.com — Fri, 16 Sep 2016 08:41:42 Z

Markdown is a light-weight text formatting syntax, suitable for multiple channels and content APIs, not just for web pages. In this post we implement a custom Episerver editor to provide users with a WYSIWYG markdown editor.

Icon for property help texts in Episerver

ted@tedgustaf.com — Thu, 01 Sep 2016 14:01:25 Z

Web editors sometimes overlook the fact that properties may have helpful descriptions available by hovering property names in edit mode. This simple example demonstrates how to add an icon in edit mode to draw attention to these tooltips.

Denote required properties in Episerver

ted@tedgustaf.com — Thu, 01 Sep 2016 11:42:07 Z

This code snippet shows how to add an asterisk to the property names of all required properties in Episerver.

Force form edit view for content in Episerver

ted@tedgustaf.com — Wed, 31 Aug 2016 15:38:19 Z

This code sample demonstrates how to force form editing for specific content types in Episerver, for scenarios where on-page editing isn't practical.

Editor for string list properties in Episerver

ted@tedgustaf.com — Thu, 14 Jul 2016 08:50:22 Z

This time we're creating a custom Dojo widget as an editor for string list properties, making use of the new PropertyList type that was introduced in Episerver 9.

Thumbnail for image properties in Episerver

ted@tedgustaf.com — Sun, 24 Apr 2016 06:30:00 Z

In this example we replace the default editor for image properties in Episerver to display a thumbnail of the selected image, but a similar approach could be used to replace the editor for any property type or UI hint.

Custom editor for a content area in Episerver

ted@tedgustaf.com — Thu, 07 Apr 2016 10:48:43 Z

The Episerver UI can fairly easily be customized to display a custom editing control for specific property types, or even specific properties. In this example we create a custom editor to allow web editors to simply click checkboxes for blocks that should be included in a content area.

EPiServer Google Maps editor on NuGet

ted@tedgustaf.com — Thu, 11 Dec 2014 22:26:20 Z

The Google Maps editor, for editing coordinates in EPiServer, can now easily be added to any EPiServer 7.5 website through EPiServer's NuGet feed.

Fallback property values in EPiServer using attributes

ted@tedgustaf.com — Wed, 12 Nov 2014 22:36:49 Z

Fallback property values in EPiServer is a common, and often repetitive, requirement which can be simplified by decorating content type properties with an attribute to specify fallback behavior.

Google Maps custom editor for EPiServer 7.5

ted@tedgustaf.com — Mon, 20 Oct 2014 14:13:00 Z

EPiServer 7 is built on the Dojo JavaScript framework, allowing us to almost inifinitely extend and customize the EPiServer UI to tailor it to specific web editor needs. This post shows an example where Google Maps is used to help web editor specify coordinates for a page, block, or media property.

Add a custom toolbar button in EPiServer 7

ted@tedgustaf.com — Tue, 24 Jun 2014 23:40:09 Z

In this post we continue exploring how we can use Dojo to extend the EPiServer 7 edit-mode interface by adding a custom toolbar button which can be used to perform actions on the content currently being edited.

Create an EPiServer widget for edit mode

ted@tedgustaf.com — Mon, 23 Jun 2014 20:28:05 Z

Tutorial on creating a Dojo widget for EPiServer 7 to extend edit mode with a widget in the assets pane, providing contextual information about the content being edited.

Render image properties in EPiServer 7.5

ted@tedgustaf.com — Tue, 29 Apr 2014 17:50:30 Z

When EPiServer dropped the VPP architecture for uploaded files we got many more options for working with media content. In this example we look at how images can be rendered when an editor simply drags and drops an image onto a page through a specific image property or a content area.

Installing EPiServer CMS 7.5

ted@tedgustaf.com — Mon, 28 Apr 2014 13:59:29 Z

Setting up a new EPiServer website became a lot easier with the release of EPiServer 7.5 The Deployment Center installer has been replaced by a Visual Studio extension using NuGet packages for all dependencies.

How to upgrade to EPiServer 7.5

ted@tedgustaf.com — Tue, 17 Dec 2013 15:32:00 Z

The process of upgrading websites to EPiServer 7.5 has started, and this will definitely be appreciated by editors and developers alike. This post sums up how to upgrade an existing website to EPiServer 7.5 and migrate VPP folders to the new media system.

Edit mode-specific styling in EPiServer 7

ted@tedgustaf.com — Tue, 05 Nov 2013 15:29:50 Z

Sometimes you need to customize how properties are rendered in EPiServer’s edit mode, particularly for content areas.

EPiServer World or Stack Overflow

ted@tedgustaf.com — Mon, 04 Nov 2013 10:13:51 Z

For development in general, Stack Overflow is among the most popular resources for finding answers on how to do stuff. Out of curiosity, I wanted to know how popular it is for EPiServer-related questions.

How to render pages in a content area in EPiServer 7

ted@tedgustaf.com — Mon, 21 Oct 2013 22:23:56 Z

This post shows how to create a page controller for partial views in order to render pages inside content areas in EPiServer 7.

Unit testing in EPiServer 7

ted@tedgustaf.com — Tue, 15 Oct 2013 18:43:21 Z

This post shows a basic example of how to mock EPiServer dependencies for unit tests.

How to get a page in EPiServer 7

ted@tedgustaf.com — Tue, 15 Oct 2013 17:25:14 Z

I’ve gotten a few questions about DataFactory in EPiServer 7, or rather about what to use instead of DataFactory. Hopefully this post will clarify how we get pages and blocks in EPiServer 7.

Highlight query matches in EPiServer Find search results

ted@tedgustaf.com — Fri, 04 Oct 2013 06:00:00 Z

Highlighted excerpts and titles in search results are used to visualize query matches, i.e. highlight text that matches the search keywords. This posts shows how to include these highlights in a basic search result.

Beginner’s tutorial on EPiServer Find

ted@tedgustaf.com — Thu, 03 Oct 2013 00:49:28 Z

This tutorial sums up what's needed to get started with EPiServer Find by creating a new index, populating it with content and then performing a basic search and presenting a simple search result.

Add custom fields to the EPiServer Search index with EPiServer 7

ted@tedgustaf.com — Tue, 02 Apr 2013 14:28:01 Z

If you have an EPiServer 7 site with basic search requirements not warranting the full blown EPiServer Find search engine, you can come a long way with EPiServer Search and some customized indexing.

Minify and bundle CSS and JavaScript files in EPiServer 7

ted@tedgustaf.com — Thu, 21 Mar 2013 07:47:22 Z

In this post we look at how to use ASP.NET MVC 4 features to minify and bundle CSS and JavaScript files in an EPiServer 7 context.

Render image properties in EPiServer 7

ted@tedgustaf.com — Tue, 12 Feb 2013 11:42:10 Z

In this post we'll look at how to use ASP.NET MVC display templates to control how image properties are rendered when using the PropertyFor helper method.

Invalidate the cache for a specific page in EPiServer

ted@tedgustaf.com — Thu, 31 Jan 2013 18:19:00 Z

Cache dependencies are useful when you're caching data and want you want that data to be refreshed when a page changes, i.e. when it is published. However, sometimes you want invalidate the EPiServer cache manually for a page.

Localization of block type names in EPiServer 7

ted@tedgustaf.com — Fri, 23 Nov 2012 11:30:32 Z

EPiServer 7 adds the concept of blocks, which differs in alot of ways from Composer blocks. One is how you provide localized names for the editor.

Conventions for EPiServer 7 MVC Views

ted@tedgustaf.com — Wed, 14 Nov 2012 14:24:44 Z

ASP.NET MVC is largely built on conventions for controllers, models, and views. However, I prefer tweaking these conventions a bit for EPiServer 7 sites to separate block views from page views.

Alloy Templates for EPiServer CMS 7

ted@tedgustaf.com — Wed, 31 Oct 2012 13:22:00 Z

This article provides an overview of the new Alloy example website available for EPiServer CMS 7. It’s intended for developers interested in a high-level description of some of the concepts used.

Enable news publishing on an EPiServer ETF website

ted@tedgustaf.com — Wed, 30 Mar 2011 23:00:00 Z

Here we add basic news publishing functionality to a blank ETF-enabled EPiServer website.

Creating a blank EPiServer website based on ETF

ted@tedgustaf.com — Wed, 30 Mar 2011 22:49:00 Z

This post goes through the steps required for setting up a new EPiServer website with ETF.

WordPress vs. EPiServer CMS

ted@tedgustaf.com — Wed, 09 Feb 2011 18:34:00 Z

This comparison of EPiServer and WordPress is actually aimed at explaining why the two should not be compared - while at the same time providing some (hopefully) funny analogies.

Disable page-leave check for postbacks inside custom property controls in EPiServer

ted@tedgustaf.com — Fri, 14 Jan 2011 01:38:00 Z

This post explains how to suppress the alert message displayed when a postback occurs inside a custom property control, for example when a button is clicked.

Attach EPiServer event handlers on startup using InitializableModule

ted@tedgustaf.com — Fri, 21 May 2010 15:12:00 Z

Explanation of the new InitializableModule concept in EPiServer 6 which is used to implement functionality that should execute when an EPiServer site starts, for example to attach event handlers.

Create a page programmatically in EPiServer

ted@tedgustaf.com — Fri, 21 May 2010 13:46:00 Z

Code sample demonstrating how to create new EPiServer pages programmatically using the DataFactory class.

Localize page type and page property names in EPiServer

ted@tedgustaf.com — Mon, 08 Sep 2008 13:25:00 Z

This post shows how to translate page type and property names and descriptions to have them appear in the correct language in the editor interface when globalization is enabled for an EPiServer web site.

Create a scheduled job in EPiServer

ted@tedgustaf.com — Fri, 08 Aug 2008 13:12:00 Z

This post explains how to create a scheduled job in EPiServer CMS.

How to get the friendly URL of a page in EPiServer CMS

ted@tedgustaf.com — Thu, 07 Feb 2008 14:23:00 Z

This post explains how to get the friendly URL of a page in EPiServer, handy for those cases where you won't get automatic rewriting of internal URLs.