If you find any errors, typos or have general feedback, select the text and click CTRL+ALT+ENTER.

The Tag Editor is designed to enable managing meta/link tags in page header sections and can be used to upload user-defined themes (or other resources) to the AngularJS apps.

See how to upload 3-rd party Bootstrap themes to your AngularJS & Bootstrap app here.

Tag Editor UI

To start working with the Tag Editor, open an existing app or create a new AngularJS & Bootstrap or AngularJS & Ionic app.

Working with the Tag Editor with both app types is similar, with the exception of their components and index page configuration.

In Ionic AngularJS apps, index pages don’t allow the addition of components, and you can only define headers, footers, tabs, etc. as these apps are mobile-oriented.

Go to Project > App settings > General.

There you’ll find the Custom tags table, with each table row consisting of three columns:

  1. “Tag name” is a select field with the tag name. There are two for now: meta and link.
  2. “Attributes” is a text input field with a string of tag attributes.
  3. “Delete” buttons to remove tags.

New tags can be dynamically added to this table (for example, when adding CSS or JavaScript via CREATE NEW > CSS or CREATE NEW > JavaScript) or deleted from it by a user. Tags are also drag&droppable and validation works for attributes input.

Managing tag priority

It is also possible to manage tag priority and their execution order. Just drag a tag to the new position and drop it:

The higher the tag is on the list, the lower its priority.

After moving the tag higher and saving, click “TEST” to see the change:

Adding a custom tag example

Lets add a custom tag on a refresh example:

1. First, let’s add a new meta tag in App settings > General.

2. For Attribute, paste the following and click “Save”:

3. By clicking “TEST,” you may watch the screen’s content refresh every 2 seconds.

Changing the initial-scale value of the default <meta name=”viewport” content=”width=device-width, initial-scale=1″/> tag won’t affect the web preview (“TEST” button). It can only be seen on mobile devices, but remember: making changes to this tag may result in misbehavior of iOS devices.