Skip to main content

How to use the Homepage Grid Layout plugin

Design a customizable, tile-based home screen that helps users quickly navigate your app.

Amr Alshareef avatar
Written by Amr Alshareef
Updated this week

The Homepage Grid Layout plugin lets you build a clean, visual home screen using tiles, images, and feature icons. You can add an image carousel, load existing features, create new plugins directly from the layout, reorder tiles, and fully customize the design, background images, and theme colors.


Requirements

  • This is a Boost plugin, available on the Standard, Growth, and Business plans.


How to use the Homepage Grid Layout plugin

  1. Log in, go to Builder in the left navigation

  2. Click the + button to open the Plugin Marketplace

    • Search for Homepage Grid Layout, then click Add Plugin

    • Name your plugin and choose whether to add it to the side menu, then click Add again

  3. Stay in the Content tab

    • To add an image carousel, click Insert Image and upload your carousel image

    • To add features to your grid:

      1. Click Load All Features to pull every plugin currently installed in your app

      2. Or click Add Feature to choose a specific existing plugin

      3. Or click Add a New Plugin to install a new plugin from the marketplace

    • To manage tiles:

      1. Click the trash icon to delete a tile

      2. Drag and drop tiles to rearrange their order

  4. Click the Design tab

    • Choose from multiple grid layout styles (varied row counts, scrollable layouts, and multi-column rows)

    • Upload background images

      1. Four background image slots support different device types (older iPhones, modern iPhones, iPad, Android)

    • Select your theme:

      1. Enable Inherit Appearance Theme to use your global branding colors

      2. Or choose Customize Theme to set a unique background color, icon color (SVG icons only), and text color for this layout

  5. Click the Security tab

    • Turn on Require Login to restrict access to logged-in users

    • (Optional) Add tag-based restrictions and choose whether to match any or all tags

  6. Click the Tagging tab

    • Enter a tag name to automatically apply to users when they open this feature

    • Click Add Tag

  7. Click the Purchase tab

    • Check Require Purchase to enable

    • Choose your product type (e.g., Single Purchase or Subscription)

    • Upload an image, fill out purchase text, and success/failure messages

  8. Click the Analytics tab to see feature performance

    • View data such as number of views, users, and devices over time

Did this answer your question?