You can create your own portlets with custom apps, both for admin and website screens. Portlets allow you to insert content into templates generated by other apps.

Once you've setup your app with a controllers.xml file you should have a section of js where you setup mappings, usually in a file called app.js. You can create a website portlet mapping like this:

controllerMappings
        .websitePortletController()
        .portletSection('myCarousel')
        .templatePath('/theme/apps/carousel/myCarousel.html')
        .method('populateMyCarousel')
        .enabled(true)
        .build();

This portlet mapping will invoke a specific template (myCarousel.html) to render the portlet. Portlet templates are simple html fragments, ie they do not need html, head and body tags. This mapping will also invoke the populateMyCarousel function, which can be used to lookup data and put it into context. You can also call js functions directly from templates.

The portlet defined above can then be used in any template in a website which uses that app:

#portlets("myCarousel")

You can also create portlet mappings for the admin system using adminPortletController(). This will display the given template on the admin profile page:

controllerMappings
        .adminPortletController()
        .portletSection('adminProfile')
        .templatePath('/theme/apps/carousel/myCarousels.html')
        .method('populateProfilePageCarousels')
        .enabled(true)
        .build();