Add and Manage Card Templates and Themes

Share on print
Share on facebook
Share on linkedin
Share on whatsapp
Share on email

Appspace Cards are HTML5 based templates or themes used for creating engaging interactive content for digital signage, corporate messaging, and workplace communications such as announcements, room scheduling and booking, productivity charts and tables, and many more. Cards support a variety of content, including images, text, video, data, and third-party integrations.

Account Owners and Publishers (location level) are able to manage their card templates and themes from the Cards module, located in Library > Cards from the ☰ Appspace menu on the console sidebar.

The Cards module consists of two tabs:

  • Templates – The Card template holds the code structure and schema of the card ensuring the card functions as intended in Library.
  • Themes – The Card theme holds the design and customization options available when creating the Card in Library.

This article illustrates the features available in this module and provides the introduction as well as instructions to configure and manage Cards as follows:

Prerequisites

Templates Tab

The Cards Templates tab is accessed via Library > Cards from the ☰ Appspace menu on the console sidebar. Here, you’ll be able to import, edit, and manage a list of templates available on the Appspace console.

Templates Dashboard

Search

The Search field is used to search card templates based on the name of the template.

  1. On the Templates tab, enter the keyword of the card template name you wish to display.
  2. Click the Enter or Return button on your keyboard, and the list of card templates matching the keyword will be listed on the Templates listing page.

Delete

  1. On the Templates tab, select the desired card template, and click the Delete icon.
  2. The desired card template would be removed from the Templates list, or reverted back to the original card template uploaded by Appspace.

Import Card Templates

  1. On the Templates tab, click the Add button.
  2. In the Import Template window, you may drag-and-drop the card template ZIP file to the drop area, or click the select files link to select the desired card template ZIP file to import.

    Warning
    If the imported card template has the same name with an existing card template, the card template is replaced, unless the Name and ID in the manifest.json file is manually changed.
  3. Once imported, the card template is displayed in the Templates listing page.

Download and Edit Card Templates

  1. On the Templates tab, select the desired card template, and click the Download icon.
  2. Extract the downloaded card template file in ZIP file format (template.zip) located in your default download folder.
  3. You may edit the extracted card template files with a text editor.
    Important
    Please refer to the Guide to Developing Custom Cards article for more information and functions of the card template files that can be edited.
  4. Once done, compress the edited files back into the card template ZIP file (template.zip).
  5. Click the Edit icon of the desired card template, to upload and update the card template in Templates.

Themes Tab

The Cards Themes tab is accessed via Library > Cards from the ☰ Appspace menu on the console sidebar. Here, you’ll be able to import, edit, and manage a list of templates available on the Appspace console.

Theme Dashboard

Search

The Search field is used to search card themes based on the name of the theme.

  1. On the Themes tab, enter the keyword of the card theme name you wish to display.
  2. Click the Enter or Return button on your keyboard, and the list of card themes matching the keyword will be listed on the Themes listing page.

Filter By

The Filter By drop-down menu allows users to determine and narrow down the themes that are displayed on the themes listing page.

Permissions

The Permissions link determines the user or user group that has access to create content based on the theme.

  1. On the Themes tab, click the Everyone link.
  2. Enter the users or user groups that will have access to the theme for content creation, and click OK.

Copy Theme

The Copy icon allows users to duplicate, or make copies of the card theme which can then be edited to match branding or target markets.

Download Theme

The Download icon allows users to download the card theme, which can then be imported to other Appspace instances.

Delete Theme

The Delete icon allows users to remove the card theme from the Themes listing page.

Enable / Disable Theme

The Lock icon allows users to enable or disable the card theme from being selected when creating content from cards.

Upload Card Theme

  1. On the Themes tab, click the Add button, and select Upload.
  2. In the Upload themes window, you may drag-and-drop the card template ZIP file to the drop area, or click the select files link to select the desired card theme ZIP file to import.
  3. Once imported, the card theme is displayed on the Themes listing page.

Create Theme

  1. On the Themes tab, click the Add button, and select Create Theme.
  2. In the Create a theme window, select the desired card template from the drop-down menu and click Next.
  3. Enter the Theme title for the card theme.
  4. In the Form tab, proceed to configure the fields available in the theme. The availability of fields that can be configured is dependant on the selected card template.
    Important
    • Click the Gear icon to access the text field customization, which allows users to lock styling options or force capitalization of text.
    • Click the Lock icon to disable the field from being viewed by the user when the theme is selected in the card template.
  5. Optionally, the Schema tab allows users to make edits directly to the code of the card template.
    Note
    Click the Restore button, to revert back to the original code, or last saved code of the card template.
  6. Once done, click Save.
Related Articles