Content Apps

Umbraco Content Apps can be configured to appear alongside forms in the Umbraco Forms backoffice section.

They will appear after the default "Design" and "Settings" apps when editing a form in the backoffice:

Umbraco Forms Content App

A content app such as the following would display only in the forms section:

    public class TestFormsContentApp : IContentAppFactory
        public ContentApp GetContentAppFor(object source, IEnumerable<IReadOnlyUserGroup> userGroups)
            // Only show app on forms
            if (source is FormDesign)
                return new ContentApp
                    Alias = "testFormsContentApp",
                    Name = "Test App",
                    Icon = "icon-calculator",
                    View = "/App_Plugins/TestFormsContentApp/testformscontentapp.html",
                    Weight = 0,

            return null;

Within the /App_Plugins/TestFormsContentApp/ folder we need the client-side files, for which an example is shown below:


    "contentApps": [
        "name": "Test Forms Content App",
        "alias": "TestFormsContentApp",
        "weight": 0,
        "icon": "icon-calculator",
        "view": "~/App_Plugins/TestFormsContentApp/testformscontentapp.html",
        "show": [
    "javascript": [


<div ng-controller="My.TestFormsContentApp as vm">
        <umb-box-header title="Forms Content App"></umb-box-header>
            <p>Current form: <b>{{vm.formName}}</b></p>


    .controller("My.TestFormsContentApp", function ($routeParams, formResource) {
        var vm = this;
            .then(function (response) {
                vm.formName =;

Finally, it needs to be registered via a composer:

    public class TestSiteComposer : IComposer
        public void Compose(IUmbracoBuilder builder)

Last updated