Templates

improve this page | report issue

Using templates

You can use templates to quickly build your application. These are specific feature enabled app templates that will help you to quickly modify and develop the app.

By default Digital App Builder comes with two templates: Mod Resorts and Tabs

  • Mod Resorts: This template provides a sample app with the use case of resorts app. It contains the login module, chat module, in-app feedback module to start with. You will must deploy the Login adapter and configure your own chatbot credentials.
  • Tabs: This template provides tabbed mobile app interface, which provides Tabs at the bottom. This templates also include the login module.

Creating a custom template

The default templates are stored at the following location:

  • For MacOS: Users/<systemname>/Library/Application Support/IBM Digital App Builder/ionic_templates/
  • Windows: Users\<systemname>\AppData\Roaming\IBM Digital App Builder\ionic_templates\

Create a custom template by duplicating and editing one of the default templates such as Mod Resorts. Customize the changes that are required in the copied template and zip the folder. Create a folder for the custom template that you have created under \ionic_templates\ and copy the .zip file into the new folder. Edit the templates.json file in \ionic_templates\ folder and add a new entry to add your template. For example, the new custom template can be added as shown below:

{
    "version": 12,
    "templates": [
        {
            "name": "Mod Resorts",
            "icon": "modresorts/modresortslogo.png",
            "templateFile": "modresorts/modresorts.zip"
        },
        {
            "name": "Tabs",
            "icon": "tabs/tabs.png",
            "templateFile": "tabs/tabs.zip"
        }
       {
            "name": "MyCustomTemplate",
            "icon": "mytemplate/customtemplate.png",
            "templateFile": "mytemplate/customtemplate.zip"
        }
     ]
}

Note

  • Make sure you increment the version number.
  • When there is an addition of a template from the release team, the update will replace the \ionic_templates\ folder. Hence, make sure you take a backup of your custom template folder and reapply after updates.
Inclusive terminology note: The Mobile First Platform team is making changes to support the IBM® initiative to replace racially biased and other discriminatory language in our code and content with more inclusive language. While IBM values the use of inclusive language, terms that are outside of IBM's direct influence are sometimes required for the sake of maintaining user understanding. As other industry leaders join IBM in embracing the use of inclusive language, IBM will continue to update the documentation to reflect those changes.
Last modified on February 12, 2020