Developers · Modules

Creating a Module

Last updated 2 November 2026

This guide discusses how to create a module on Insites.

Prerequisites

To follow this tutorial, you must understand basic Insites concepts, the prescribed development workflow, and Modules:

Steps

Creating a module is a three-step process:

Step 1: Creating directories
Step 2: Creating GraphQL queries
Step 3: Creating a page

Step 1: Creating directories

Create two directories inside the directory called , then create the and folders. Place the directory inside and the directories inside .

This is the structural overview of the module you'll create:

my_admin
├── private
│   └── graphql
│       ├── get_records.graphql
│       └── get_pages.graphql
└── public
    └── views
        └── pages
            └── admin.liquid

Step 2: Creating GraphQL queries

Create a GraphQL query that pulls a list of Records.

modules/my_admin/private/graphql/get_records.graphql

query get_records {
  records(
    per_page: 10
    sort: [{ id: { order: DESC } }]
  ) {
    results {
      table
      properties
    }
  }
}

Create another GraphQL query that pulls a list of pages

modules/my_admin/private/graphql/get_pages.graphql

query get_pages {
    admin_pages(per_page: 10) {
    results {
      format
      slug
    }
  }
}

Step 3: Creating a page

Create a page for your module:

modules/my_admin/public/views/pages/admin.liquid

---
slug: my_admin
---

<h2> Module example - Admin </h2>

<div class="row">
  <div class="col-xs-12 col-lg-6">
    <h3> Records </h3>
    {%- graphql c = "modules/my_admin/get_records" -%}
    <table class="table table-compact">
      <thead>
        <tr>
          <th> Name </th>
          <th> Properties </th>
        </tr>
      </thead>
      <tbody>
        {% for record in c.records.results %}
          <tr>
            <td> {{ record.table }} </td>
            <td> {{ record.properties }} </td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  <div class="col-xs-12 col-lg-6">
    <h3> Pages </h3>
    {%- graphql c = "modules/my_admin/get_pages" -%}
    <table class="table table-compact">
      <thead>
        <tr>
          <th> Slug </th>
          <th> Format </th>
        </tr>
      </thead>
      <tbody>
        {% for page in c.admin_pages.results %}
          <tr>
            <td> {{ page.slug }} </td>
            <td> {{ page.format }} </td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>

Use the queries as usual, but prefix the name with the module name.

{%- graphql c = "modules/my_admin/get_pages" -%}

The only difference between this code and the code of a regular Instance is that this module code is split
into public and private folders, and if you'd pull the code when it's installed on an Instance,
you would get a structure like this:

.
├── app
│   └── views
|   └── graphql
│       ...
└── modules
    └── my_admin
        └── public
            └── views
                └── pages
                    └── admin.liquid