Take the community feedback survey now.

Mari Jørgensen
May 24, 2011
  6816
(10 votes)

EPiServer Commerce and Composer R2 – a Love Story!

With the release of EPiServer Composer 4 R2 we now got a great tool for building and optimizing personalized start pages and landing pages. What better way to combine a flexible layout with personalized content, than for an ecommerce site.

New and improved Composer

thumbsup_iconThe Composer R2 release has several new/improved  features:

  1. Personalization blocks
  2. New preview mode
  3. Editing block trough double-click
  4. Improved drag and drop
  5. New and improved functions
  6. Toggle visibility of block borders and headers

 

Easier to install

Page and function type definitions are now automatically registered as part of the Sample package installation - no longer need for manual import in Admin mode.

No more CSS and JQuery conflicts

In Composer 4 R2 the Composer CSS and JavaScript have now been encapsulated to make sure it does not interfere with your custom files. This is great news for us developers!

To learn more about news in EPiServer Composer R2, read Peter Sunnas article.

Installing Composer on a Commerce site

As the title of the blog post indicated, getting Composer to play nice with the demo Commerce site is pretty straight forward. You need to make minor adjustments to the Composer templates, this is because the Composer sample package is built for the Alloy Technologies sample site. The necessary changes are described below. 

Path to MasterPage file

Change the MasterPageFile attribute for the Composer template files (aspx files located in <siteroot>/Composer/Pages/) to use the Commerce master page.

Name of Content Placeholder

In the same aspx files as mentioned above, we also need to change the name of the content placeholder to use.

ContentPlaceHolderName2

Also, since the Commerce demo site is using “en-US” as the default UI language, you might notice some missing translations in the Composer dialogs.

Translations

A quick fix for this is to

  1. Locate Dropit.Extension_EN.xml inside the lang folder
  2. Copy file and name it Dropit.Extension_ENUS.xml
  3. Open file and change
    <language name="English" id="en"> to
    <language name="English United States" id="en-US">

That’s it – your new commerce pages are just a few drag and drops away. 

viewMode

May 24, 2011

Comments

David Bowen
David Bowen May 24, 2011 03:00 PM

Excellent work.

Steve Celius
Steve Celius May 24, 2011 03:22 PM

If you experience installation issues, have a look at this forum thread:
http://world.episerver.com/Modules/Forum/Pages/Thread.aspx?id=50072&epslanguage=en

Jeff Wallace
Jeff Wallace Aug 22, 2011 06:02 PM

Great blog Mari! Straightforward and accurate.

Please login to comment.
Latest blogs
Optimizely CMS - Learning by Doing: EP06 - Create Header, Footer, Menu & Component/View for Blocks

  Episode 6  is Live!! The latest installment of my  Learning by Doing: Build Series  on  Optimizely CMS 12  is now available on YouTube! This vide...

Ratish | Nov 4, 2025 |

Going Headless: 3 Ways to Store Custom Data in Optimizely Graph

Welcome to another installment of my  Going Headless  series. Previously, we covered: Going Headless: Making the Right Architectural Choices Going...

Michał Mitas | Nov 3, 2025

A day in the life of an Optimizely OMVP - What's New in Optimizely CMS: A Comprehensive Recap of 2025 Updates

Hello and welcome to another instalment of a day in the life of an Optimizely OMVP. On the back of the presentation I gave in the October 2025 happ...

Graham Carr | Nov 3, 2025

Optimizely CMS Mixed Auth - Okta + ASP.NET Identity

Configuring mixed authentication and authorization in Optimizely CMS using Okta and ASP.NET Identity.

Damian Smutek | Oct 27, 2025 |