HomeDev GuideRecipesAPI Reference
Dev GuideAPI ReferenceUser GuideLegal TermsGitHubNuGetDev CommunityOptimizely AcademySubmit a ticketLog In
Dev Guide

Create an MVC component for the UI

Describes how to create a component in the Optimizely Content Management System (CMS) user interface.

The Optimizely Content Management System (CMS) extension of the IFrameComponent has the following additional parameters:

  • UrlFromUtil – Optional. The URL to the source is relative to the Utils folder. Used instead of Url property.
  • UrlFromUi – Optional. The URL to the source is relative to the UI folder. Used instead of Url property.

  1. Add a Controller and annotate it with an IframeComponent attribute.
    [IFrameComponent(Url = "/helloworld", Title = "Hello World Component", Categories = "content")]
    public class HelloWorldController: Controller {
      public ActionResult Index() {
        return View();
      }
    }
    
  2. Add a Index.cshtml view to the Views/HelloWorld directory:
    @{
        Layout = null;
     }
        
     <!DOCTYPE html>
        
     <html>
       <head>
         <meta name="viewport" content="width=device-width" />
         <title>HelloWorld</title>
       </head>
       <body>
         <div>
           <div>Hello World</div>
         </div>
       </body>
     </html>