Keyboard Items

This page is intended as a reference guide for the available keyboard items and function buttons, and the properties and options for these. For a guide on how to create keyboards and add items to them, see the link below.

Components

The keyboard items in the ‘components’ list in the keyboard editor are the 4 main types of keyboard items.

Common Item properties

Row Span and Column Span
This sets how wide and tall the item is. It describes how many rows and columns of the item grid the item will cover.
Font Size
The maximum size of the text on the button. Type in a number for the size. The font size may stay below this in order to fit the button text in the available button size.
  • Use the ‘enter’ button to add new lines into your button text on a stacked button if the text is too long in a single line to reach your desired text size.
Background colour
This is the main colour of the button. Click to bring up the colour options. Select the colour you want from the list.
  • The 2 columns display the colour that will be used when a device/till is in dark mode and in light mode.
  • The tint opacity slider makes the right hand column brighter with a higher percentage. At 100%, the left column will be black and the right column will be white.
  • Use the button between the columns (circle with 2 opposing arrows) to switch which mode is on the right side and will be made brighter by the opacity slider.
Font Colour
Not manually selectable. This will be automatically set to black or white to provide the best contrast with the background colour of the button.
Border Colour
This is the colour of the thin box around the border of the button. Set this in the same way as the background colour.

Number Pad

This is the number pad that can be used at the till to type in numbers when required, usually before pressing another function or product button.

Examples

Selling multiple of a product

Entering in a discount amount

Entering in a payment amount.

Properties

Row Span and Column Span
See Common Item Properties above.

Order View

This is the box that displays what products have been added to the sale and the product line totals, sale totals, and payment totals. It also has buttons built into it for adding customer details, changing the price level, adding or removing products, printing a receipt, and cancelling the sale. These buttons can’t be moved within the order view box.

Properties

Row Span and Column Span
See Common Item Properties above.
Background Colour
See Common Item Properties above.
Row Colour
The colour of the box around a row in the order list.
Selected Row Colour
The colour of the box around a row in the order list when it is the currently selected row. A row is selected if it is the last product added or the user clicks on presses on that row.
Table Label Colour
The colour of the ‘TABLE’ text in the top left of the order view.
Customer Label Colour
The colour of the ‘CUSTOMERS’ text in the top middle of the order view.
Price Level Label Colour
The colour of the ‘PRICE LEVEL’ text in the top right of the order view.
Sales Finalised Colour
The colour of the box that appears at the bottom of the order list to tell you that the sale is fully paid for and finalised.

Example

These colour settings:

An example of the order view colours settings

Make the number pad look like this (in dark mode):

The order view using the example colours

Product Button

This links directly to a product. When pressed at the till, it adds the product into the sale. It will automatically display the product image attached to the product. See Adding or editing the product image for instructions on how to add an image to a product. If no image is displayed, it will automatically display the product description.

If you edit a product and change the product image, any open tabs with the template or layout editor will not display the new image on that product’s button until they are closed and reopened.

You can also add a product button by clicking on the ‘Products’ drop down list in the Keyboard Items rather then going to ‘components’ and then ‘product button.’ The products drop down list has a search bar to make it quicker and easier to add a specific product.

Properties

Row Span and Column Span
See Common Item Properties above.
Product
This is a drop-down list that allows you to select the product to be attached to this button.
Edit Product
Press this button to open up a new tab with the product edit screen for the product attached to this button or jump to an already open product edit tab if one is already open for this product.
Label
Type text into this field to change the text displayed on this button. It will override the product description once you enter something into this field. You can use this to simplify the name displayed on the button if the product description is long or hard to read at a glance.
Image fit
This is a drop-down list giving options for how to display the product image on the button.
  • Fill – This will fit all of the image onto the button without stretching. It will use the colours on the edge of the image to fill in the empty sections of the button. Putting a thin border of a solid colour around an image before attaching it to the product can make this option neater if the image has multiple colours around the edge.
  • Cover – This will expand the image without stretching it until the whole button is covered by the image. It will cut off any part of the image that doesn’t fit onto the button. This works best when the shape of the image is very close to the shape of the button or if the image is still easily recognisable when cropped.
  • Fit – this will stretch the image to fit the shape of the button. This can cause distortion in text and image.
  • None – This will stop the product image from appearing on the button. The button will use the button label if there is text in the label field, or the product name if there is no text in the label field.

Image Fit Examples

Original product image:

A Product image in it's original shape

Fill method on button:

The image on a button with the fill method

Cover method on button:

The image on a button with the cover method

Fit method on button:

The image on a button with the fit method
Background Colour
See Common Item Properties above.
Stacked Button
This is a button that can be linked to the functions available for use on the keyboard.

It is formatted with a space for an icon in the middle, and text above and below the icon. It will centre the 3 fields, so if any of these 3 is not used or is larger than the other, it will adjust.

A stacked button with a single line above the icon, an icon, and a single line below the icon. A stacked button with multiple lines above the icon, no icon, and a single line below the icon. A stacked button with multiple lines above the icon, an icon, and a single line below the icon. A stacked button with multiple lines above the icon, no icon, and a single line below the icon.

Properties

Row Span and Column Span
See Common Item Properties above.
Font Size
See Common Item Properties above.
Above Icon
Type in the text that you want above the icon. You can press ‘enter’ to go to a new line if you want more than 1 line in the text.
Icon
Use the search button (magnifying glass) to search through available icons. Use the text field in the search box to display icons with that text in the icon name. If you know the name of the icon, you can also just type in into the box.
Below Icon
Type in the text that you want below the icon. You can press ‘enter’ to go to a new line if you want more than 1 line in the text.
On Click
Use the drop down menu to select which function you wish to attach to this button. See Functions below
Background Colour
See Common Item Properties above.
Border Colour
See Common Item Properties above.
Icon Colour
This is the colour of the icon on the button if you have added an icon.

Functions

Some of these functions are available in the ‘Functions’ drop down list in the Keyboard Items. Dragging a function from this list onto your keyboard creates a button using a template with some properties such as icon, text, and colours already set.

The rest are only available by creating a stacked button and using the ‘on click’ drop down list to link the function to the button.

Add Instruction
This function allows you to specify a product and add it to another product as an instruction. This does not require the product to be part of an instruction group. Use this to create buttons for some common instructions like ‘takeaway’ and common allergy warnings that you may want to use with any product but not want to attach to each product as an instruction group.
  • When you select this function on a stacked button, you will get another drop down list available below ‘on click.’ Use this list to select a payment method you have already set up in the HQ.
Add Payment Method
This function will add a specified payment method to the current transaction. Use this to create payment buttons for any payment methods that you have set up. See Payment Methods.
  • When you select this function on a stacked button, you will get a drop down list and 2 fields available below ‘on click.’ Use the list to select a product you have already set up in the HQ that you wish to use as an instruction through this button.
  • See Taking Payment in a Sale
Add to Order
This function will add a specified product to the transaction. Use this to create a product button that doesn’t automatically use the product image. This allows you to assign a product to the button using the appearance options of a stacked button rather than a product button.
  • When you select this function on a stacked button, you will get another drop down list available below ‘on click.’ Use this list to select a product from your product list.
Cancel Sale
This function will cancel and end the current transaction without taking payment. This same function is built into the Order View keyboard item. See Cancelling a Sale
Cash
This function will add a cash payment to the current transaction. You can type the amount to be paid into the number pad and then press the cash button to pay that specific amount or you can just press the cash button to pay the full amount due in the current transaction.
Clear Item
This function will clear the currently selected product in the Order View. This same function is built into the Order View keyboard item.
Edit Customer
This function allows you to add or edit the customer details of the current sale. This includes name, phone number, email, and notes.
Fixed Discount
This function will discount the current transaction by a dollar amount typed into the number pad before pressing this button. Use this function to allow staff to discount the transaction by a custom amount.
Fixed Tip
This function will set the tip amount for the sale to a dollar amount typed into the number pad before pressing this button. Use this function if a guest wishes to add a set dollar amount to the sale as a tip.
Hold/Recall Sale
This function will save the current transaction to a list of held sales and allow you to start a new transaction. If it is used without a transaction having been started, it will bring up the list of held sales and allow you to select a held sale to resume. Use this to allow staff to put aside a sale, continue to serve other customers, and then come back to the previous sale and continue it.
No Sale
This function will open the cash drawer and record a no sale. Use this if you need to get into the cash drawer outside of taking a payment of cash. It leaves a record so you can audit who has opened the drawer outside of normal cash sales, and when they did so.
Open Preferences
Opens the preferences window for the product selected in the Order View. This allows you to edit the instructions attached to the product and add custom/free text instructions. This same function is built into the Order View keyboard item by double pressing/clicking on the product in the Order View.
Open Search
This function will bring up a search bar and allow you to type part of a name to search for all products with that text in their name and then add that product into the sale. Use this if you will have a large complicated keyboard where that may be difficult to find rare products or products that will not have buttons. A common use is to allow staff to find barcoded products without product buttons if the barcode scanner is not working.
Percent Discount
This function will discount the current transaction by a percentage typed into the number pad before pressing this button. Use this function to allow staff to discount the transaction by a custom percentage.
Percent Tip
This function will set the tip amount for the sale to percentage typed into the number pad before pressing this button. Use this function if a guest wishes to add a tip to the sale by a certain percentage.
Preselect Product Size
This function will change the next product added to the sale to a different size if it has been set up on that product. Eg Change a small coffee to a large, change a schooner of beer to a pint. Use it to reduce the number of buttons necessary on your keyboard by putting the product buttons for just one size across a range of products and then setting up ‘preselect product size’ buttons to give access to different sizes across that range. Eg Put all of your small coffee products on the keyboard and set up a single ‘Large’ button to allow changing the small to a large.
Preset Fixed Discount
This function will discount the current transaction by a dollar amount you set. Use this function to set up discount buttons for common predetermined discounts you offer to customers eg. $5 off coupon
  • When you select this function on a stacked button, you will get 1 more field available below ‘on click.’ Type the discount amount for this button into this field. This button will always give the discount amount in that field when pressed.
  • See Discounting a Sale.
Preset Percent Discount
This function will discount the current transaction by a percentage you set. Use this function to set up discount buttons for common predetermined discounts you offer to customers eg. Seniors discount, Half Price Tuesdays.
  • When you select this function on a stacked button, you will get 1 more field available below ‘on click.’ Type the discount percentage for this button into this field. This button will always give the discount percentage in that field when pressed.
  • See Discounting a Sale.
Review Sales
This function allows you to see transactions from the last 2 weeks and perform some further functions:
Run Shift Check
This will print out a summary of the sales and payment totals for this till since the last Shift Report. It will not reset the totals back to 0. Use this to get a current running total of the sales and payments taken during a shift.
Run Shift Report
This will print out a summary of the sales and payment totals for this till since the last Shift Report. The totals will all be reset back to 0. Use this at the end of a shift, or when the cash drawer is taken and balanced, to get the totals required to balance your cash drawer and payments.

Select Product Size : This function will change the product selected in the Order View to a different size if it has been set up on that product. Eg Change a small coffee to a large, change a schooner of beer to a pint. Use it to reduce the number of buttons necessary on your keyboard by putting the product buttons for just one size across a range of products and then setting up ‘select product size’ buttons to give access to different sizes across that range. Eg Put all of your small coffee products on the keyboard and set up a single ‘Large’ button to allow changing the small to a large.

Set Table
This function will add a table number to a sale or open an in progress a la carte table.
  • When you select this function on a stacked button, you will get 2 more drop down lists available below ‘on click.’
    • The first is the list of available table numbers. Select a number to assign the button to a particular table. Leave this at — if you want to be able to type the table number into the number pad and use the one button any table number.
    • The second is the type of table.
      • None – Use this to create a button that will remove the table number from the current open table.
      • Bistro Table – Use this to create a button that will open bistro tables.
      • A la carte Tables – Use this to create a button that will open a la carte tables.
  • See Table Sales for an explanation of the types of tables and how to use them.
Split Bill
This function opens the split bill window and allows you to split the bill into multiple separate payments so guests can pay separately for parts of the total bill. It allows splitting by number of people paying, individual items, or custom dollar amounts.
Split Payment
This function opens the Split Payment window. This window shows the unpaid products, amount due, print bill button, a number pad and common payment methods. Use this if you don’t want to dedicate button space to payment buttons or if you want to have the payment methods and details all together in one window to make it easier when a customer is making payment with multiple methods.
Start Cash
This function will add a preset amount of cash payment to the current transaction. Use this to set up a Cash button with a preset amount of $5, $10, $20, 50, or $100.
  • When you select this function on a stacked button, you will get another drop down list available below ‘on click.’ Use this list to select the preset cash amount you want for this button.
  • See Taking Payment in a Sale
Start EFTPOS
This function will take payment through your linked EFTPOS terminal in the current transaction. You can type the amount to be paid into the number pad and then press the EFTPOS button to pay that specific amount or you can just press the EFTPOS button to pay the full amount due in the current transaction.
Start Print
This function will print a bill for the current transaction or print a tax invoice for the last finalised transaction. It will send to the receipt printer configured on the till. This same function is built into the Order View keyboard item.
Switch Layout
This function will switch the displayed layout on the keyboard to the specified layout. Use this to create buttons to navigate between all the layouts you have created linked to a template.
  • When you select this function on a stacked button, you will get another drop down list available below ‘on click.’ Use this list to select a layout from your layout list. Only layouts linked to the same keyboard template will be available.