Editing the smart grid using the POS editor
To ensure your POS device suits the needs of your retail environment, you can customize your smart grid templates by adding and editing the smart grid tiles using the POS editor. These tiles can help retail staff with completing tasks and completing customer purchases. If there are products that you regularly sell or tasks that your staff often need to complete, then you can add tiles to your smart grid to help complete those actions.
You can also customize the smart grid for an individual POS location directly from Shopify POS. Learn more about customizing the smart grid from the Shopify POS app.
On this page
Access the POS editor
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template that you want to preview.
Add tiles to your smart grid template
You can add new tiles to your smart grid for extra functions, or to access regularly needed tools for your retail staff. For example, if your staff regularly need to access your online store's FAQ page, then you can add a link tile that links to your online store's FAQ.
You can add the following tiles to your smart grid:
| Tile type | Description |
|---|---|
| Action | Creates a tile that allows users to perform specific actions that modify the current order, including the following tasks:
|
| Link | Creates a tile that directs to a website of your choosing. When creating the tile, you can select the URL and the title that displays on the tile itself. |
| Fee | Creates a tile that applies a custom sale amount to the current order. When creating the tile, you can set the price to apply to the order, set if this fee is taxable, and select the title for the custom sale amount that displays on the tile itself. When applied to an order, it displays as Additional fee with the fee title as a subheader. Only 1 additional fee can be applied to an order. |
| Discount | If you use discounts on your store, then you can create a discount tile that applies a discount code, a percentage-based discount, or fixed amount discount to your smart grid. If you want to offer a discount code on Shopify POS, then you first need to create a discount code in your Shopify admin. When you add or edit a discount code tile, you can search for and select from your available discount codes using the POS editor. For percentage and fixed amount discounts, you can also include an optional reason for the discount that displays on the tile itself. |
| Product | Creates a tile that adds a specific product to the cart. This tile is ideal for quickly adding your most frequently-bought items to the cart without the need to scan the item. |
| Collection | Creates a tile that opens a specific collection on your smart grid, allowing you to quickly add any items from that collection to the cart. |
| Fulfillment | Available only for locations using Shopify POS Pro.
Creates a tile that displays an order list for the different supported fulfillment methods from the POS location:
|
| Embedded Apps | Creates a tile to quickly access a function for a Shopify POS app. If you want to add an app to your smart grid, then you need to make sure that you're using an app that integrates with Shopify POS. |
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template that you want to add a tile to.
In the page that you want to add the tile to, click ⊕ Add tile.
Select the type of tile that you want to add.
Customize the details for the tile based on the type of tile that you're adding.
Click Add.
Click Save to save the changes to your smart grid template.
Customizing your smart grid tiles
You can edit, reorder, delete, or change the color of tile icons from your smart grid. You can't change the font size or style on smart grid tiles.
When you edit a smart grid for a specific location using Shopify POS, and the template assigned to that location is also used at other locations, your changes are saved as a new copy of the original template. This new version will only apply to the POS location you edited, so your changes won’t affect the smart grid templates at other locations.
Edit tiles in your smart grid
You can edit the content of certain tiles in your smart grid template. This includes product tiles, link tiles, and discount tiles.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template with the tile that you want to edit.
Click the tile that you want to edit.
Update the tile details, such as the product, link, or discount associated with the tile.
Click Save to save the changes to the tile.
Click Save to save the changes to your smart grid template.
Reorder tiles in smart grid
You can reorder smart grid tiles on the same page. Tiles can't be reordered from one page to another page.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template with tiles that you want to reorder.
Hover your cursor over the smart grid tile that you want to move.
Click and hold the
icon beside the smart grid tile, and then drag the tile to another position in the list on the same tile page.
Click Save.
Delete tiles from your smart grid
You can remove a tile from a smart grid.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template with the tile that you want to delete.
Hover your cursor over the smart grid tile that you want to delete.
Click the
icon to remove the tile.
Click Save.
Customize color of tile icons
You can change the color of your smart grid tile icons, except for product and collection tiles, which display the product or collection image as the tile background.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template with the tile that you want to recolor.
Click the smart grid tile that you want to edit.
In the Color selector, use the drop-down menu to select a color for the tile icon.
Click Save.
Managing tile pages for your smart grid template
Tile pages are used to group tiles on the smart grid. You can navigate between tile pages in the Shopify POS app by swiping left and right on the smart grid. All types of tile can be added to any tile page, so how you choose to organize your smart grid tile pages is up to you. You can create, reorder, and delete tile pages in the POS editor.
Tiles can't be moved between tile pages. To move a tile from one tile page to another, you must delete the tile from the initial page and re-add it to the second page.
Create a new tile page for your smart grid
You can create a new tile page from the POS editor. All tile pages must have at least 1 tile when saving the smart grid template.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template that you want to add a tile page to.
Click ⊕ Add tile page.
Click ⊕ Add tile at add a tile to the new tile page.
Click Save.
Reorder tile pages in your smart grid
You can reorder the tile pages in your smart grid. When your reorder tile pages, the page numbering updates to reflect the new page order. For example, if you move Page 4 to be up above Page 2, then it becomes the new Page 2, and all subsequent pages are renumbered to account for the new order.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template with the tile pages that you want to reorder.
Next to the page number that you want to reorder, click the
icon and drag the tile page up or down to rearrange it.
Click Save.
Delete tile pages from your smart grid
You can delete a tile page at any time. All of the tiles on the tile page are deleted as well.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template with the tile pages that you want to delete.
Next to the Page number that you want to delete, click the
icon.
Click Save.
Preview your smart grid in the POS editor
You can use the POS editor to preview how your smart grid displays in the Shopify POS app on different devices, using either dark mode or light mode. By default, the POS editor displays your smart grid in tablet format, using dark mode.
Steps:
From your Shopify admin, go to Point of Sale > Settings.
In the Customization section, click POS app to open the POS editor.
In the Smart grid section, select the smart grid template that you want to preview.
In the Preview options menu, select how you want to preview your smart grid:
- In the Device section, select the type of device (tablet or mobile) that you want to use.
- In the Appearance section, select the display mode (dark or light mode) that you want to use.