Design Awesome Content with EPiServer CMS

Dream. Dare. Do – that is Suyati’s work principle in a nutshell.

Jun
27
2016
  • Author:
  • Sahana Rajan

Episerver CMS

For any company plunging into the mobile world, the phrase “Responsive Web Design” (RWD) must become a commandment. It brings together the three most important components of an outstanding web design: dynamic grids, media query and elastic images. EPiServer has emerged as a leading CMS over the years. However, those who intend to migrate to the EPiServer CMS platform have to remember that the EPiServer platform is not automatically responsive and their site will only perform smoothly when the front-end code is updated appropriately.

In Episerver, even though extra design work has to be done, the shift to a responsive web design is made easier with a series of functionalities specifically built for enabling responsive content. Here are four ways in which EPiServer allows you to create responsive content for your website!

 

Shape Your Content for Many Screen Sizes with Preview Feature

When you create a new content page on Episerver, you can preview how the published page would appear using Preview option. You can check preview for a variety of devices including tablets, smart phones and desktops. By using the preview feature, you can make sure that the content is aligned and published in appropriate manner depending on the device.

 

Edit the content on preview mode

When you preview the content page on different screen sizes, you can also edit the content directly. There is no need to make changes on the editor and shift to the preview mode every time. You can make the changes while the page is on preview. This allows you to edit and revise your content faster. Currently, there are no other CMS which allow such a function.

 

Publication and preview of content blocks across pages

Different pieces of content like CTAs (calls-to-action), embedded videos, authors’ bios and social media posts can be used in many pages. Depending on the shape and size of the device screen, the blocks will be molded. The phenomenal amount of customization allowed by EPiServer is evident through the drag-and-drop option to add in forms, content, buttons and other media types at any position on the page you desire. You can also personalize the landing sites to make sure that specific visitor segments can bring in tailor-made messages. When the page is published, it can be instructed to undergo A/B and multi-variate testing to gain insight into conversions. You can revise the landing pages to enhance the experience.

To access how a content block would look on a page, you can preview the blocks at varying widths. Once you grasp how the content block behaves, you will be able to predict the effect of any updates to them in the future. When you make changes to the content block on a single page, you will be able to have an idea of how it would appear on all the other pages as well.

 

Position content blocks correctly with pre-defined renderings

While using EPiServer CMS, content writers could face problems with content types. A block on the page could align incorrectly when displayed on mobile devices. This problem can be resolved using Episerver’s rendering functionality.

There are pre-defined renderings which mention conditions for using types of content blocks. This makes sure that the content blocks are placed correctly and can be instantly re-sized for different mobile devices. Templates are used for rendering the content blocks. When you render block in a parent page, then the block template is applied within the page template context. According to the context within which the content block is rendered (a MVC page or Web Form page), the template is chosen automatically.

 

While comparing WordPress and Episerver, Ted Nyberg mentions the incredible capacities of CMS framework provided by the latter which allows for customization and richer design. With the power that EPiServer hands down to its content developers, companies can cater to their customers’ needs smoothly, designing websites which will be responsive to their behavior.

Leave a Comment

Your email address will not be published. Required fields are marked *