Editing your app

High level customisation of branding, images and colors, and editing of other common features.

The simplest way to get your app out there is to choose a template, and then customise and edit it to make it look and feel authentically yours.

In this section we’ll go through some high level customisation of branding, images and colors, and editing of other common features.

Before we get into customisation, it’s important to understand editing toolbars.

The Editing Toolbar

A toolbar is shown above a part when it is selected. This toolbar shows actions specific to the type of part selected as well as common actions.

In the image below, a selected part and part toolbar is shown for a card:

The toolbar actions are described below:

Tool

Action

Add. The + icon anywhere in Appeggio will allow you to add a part.

The shortcut key for Add is the A key.

Change. This allows you to change the part. By clicking on this dropdown you’ll see the range of functions you can apply to change the part.

The shortcut key for Change is the C key.

Color of part. Allows you to change the color of the part using the color picker tool.

Color of text. Allows you to change the color of the text using the color picker tool.

Weight of text. Allows you to adjust the weight of the text within the part.

Alignment of text. Allows you to adjust the alignment of the text within the part to left, center or right.

Size of text. Allows you to adjust the size of the text within the part.

Connect to data.

The shortcut key for Bind to Data is B

Actions menu. Allows you to delete, duplicate, cut, copy, paste, undo as well as other actions depending on the type of the part.

The icon below is known as a dropdown and will always open a menu to show you the actions available.

The 'dropdown' icon

As you move the mouse over an icon you will see a ‘tooltip’ that describes what the action will do. Most tooltips will contain a letter or meta-key and a letter indicating what keyboard shortcut you can use to invoke the actions. For example ‘Click to Add a Part (A)’ indicates that the A key can be used as a keyboard shortcut.

In the next sections we’ll go through customising the branding, images and colors to make your template look and feel like your own. We'll then go on to quick editing of parts such as text, buttons and icons and other things you'll need to customise for your app.