---
title: "Customize Your Endpoint | Docs"
description: "ZingGrid has preset parameters that make it even faster to get your grids up and running."
url: https://www.zinggrid.com/docs/guides/customizing-your-endpoints
---

```text
experiment_id: web-retrieval-v1
fixture_id: /docs/guides/customizing-your-endpoints.md
mode: provenance
representation: markdown
origin_response_id: 380cf6e37b3f48bcede4dfc71223de74
version: 2026-10-21
version_created_at_utc: 2026-10-21T20:42:35.717Z
version_nonce: 5fb7223615d83152814092b45e3659df
generated_at_utc: 2026-11-08T09:56:39.977Z
response_nonce: fb23fba54d600aa7ffd94946a740be01
```

# Customizing Your Grid Using `<zg-param>`

The `<zg-param>` element is arguably one of the most useful in ZingGrid. Different `<zg-param>` configurations automatically set your grid up with less markup for you to write! You can refer to the [`zg-param` page](https://www.zinggrid.com/docs/api/tags/zg-param) for a full list of the available options and a description of each. In this guide, you will be presented with what we think are the most useful applications of using `<zg-param>`.

## Basics

`<zg-param>` is a non-visual element used to pass the configuration options for the `<zg-data>` element more cleanly via name-value pairs. The element is not required, though it is preferred, as everything set within a `<zg-param>` element can also be set directly on `<zg-data>` via the config attribute (developers should note this when setting complex values for the value attribute to use JSON encoded values). As a non-visual element, CSS styling does not apply to `<zg-param>`.

## CRUD actions
The `<zg-param>` element can be used in a CRUD grid to configure custom options. There are a number of ways to do this. The first includes using the following `<zg-param>` `name` attribute values: `createOptions`, `readOptions`, `updateOptions`, and `deleteOptions`. After setting the `name` attribute to one of those values, you can set the `value` attribute to an object with different configurations for the HTTP requests. See the below demo for these `<zg-param>`s in action:

[Example code](https://app.zingsoft.com/demos/embed/67G8B9XF)

Another way you can overwrite CRUD functionality is using the `createMethod`, `readMethod`, `updateRowMethod`, `updateCellMethod`, and `deleteMethod` `<zg-param>`s. These allow you to explicitly set the HTTP method used for each of the CRUD requests.

[Example code](https://app.zingsoft.com/demos/embed/XNRZG484)

You can also add headers to your HTTP requests using the `headers` `<zg-param>`. This is useful for sending authorization tokens on user-restricted grids that require authorization.

[Example code](https://app.zingsoft.com/demos/embed/ZK2QWNOR)

These are just a few of the examples for using `<zg-param>` to edit CRUD functionality. Refer to the [`zg-param` page](https://www.zinggrid.com/docs/api/tags/zg-param) for a full list of parameters, including demos for each.

## Grid Features
Some grid features can be toggled with `<zg-param>` values. Below are a few examples, but again, refer to the [`zg-param` page](https://www.zinggrid.com/docs/api/tags/zg-param) for a full list.

### Searching
Sets the search term for searching the grid.

[Example code](https://app.zingsoft.com/demos/embed/CW5F3RVA)

### Scrolling and Paging
To have the grid only load the data that is currently visible, use the `loadByScroll`  `<zg-param>`.

[Example code](https://app.zingsoft.com/demos/embed/XBUU0FKR)

Similarly, to have the grid only load data one page at a time, use the `loadByPage` parameter.

[Example code](https://app.zingsoft.com/demos/embed/FLVRKTRN)

## Endpoint Adapters
Adapters allow you to set multiple `<zg-param>` tags using just one actual element in your markup. This works by [registering an adapter](https://www.zinggrid.com/docs/api/methods/zinggrid-object#registeradapter) using the `registerAdapter()` method, which will list the `name` and `value` attributes for each `<zg-param>`. Then, you can set a single `<zg-data>` element with the `adapter` attribute set to the title of the adapter you register.

### HTML  before `registerAdapter()`
```html
<zing-grid editor caption="Movies" page-size="10" infinite height="100px">
  <zg-data src="https://zinggrid-examples.firebaseio.com/movies/">
    <zg-param name="startAtKey" value="startAt"></zg-param>
    <zg-param name="limitToKey" value="limitToFirst"></zg-param>
    <zg-param name="sortByKey" value="orderBy"></zg-param>
    <zg-param name="searchKey" value="equalTo"></zg-param>
    <zg-param name="startAtValue" value="true"></zg-param>
    <zg-param name="addValueQuotes" value="true"></zg-param>
    <zg-param name="sortBy" value="title"></zg-param>
  </zg-data>
</zing-grid>
```

### HTML after `registerAdapter()`

```html
<zing-grid editor caption="Movies" page-size="10" infinite height="100px">
  <zg-data src="https://zinggrid-examples.firebaseio.com/movies/" adapter="myCustomAdapter"></zg-data>
</zing-grid>
```

### JavaScript

```javascript
  const adapterOptions = {
  limitToKey: 'limitToFirst',
  startAtKey: 'startAt',
  sortByKey: 'orderBy',
  startAtValue: true,
  sortBy: '"title"',
};

ZingGrid.registerAdapter('myCustomAdapter', adapterOptions);
```

### registerAdapter() Grid

Here is a complete grid which calls the `registerAdapter()` method:

[Example code](https://app.zingsoft.com/demos/embed/FCWB5U24)

For a full guide and a list of our preset adapters, refer to our [adapters page](https://www.zinggrid.com/docs/features/adapters).