# Mod Listing Panel

The first panel in the Page Editor lists your available mods. This is called the **Mod Panel.**

### What is a Mod?

A mod is a grouping of one or more actions and enhancements that can run on a web page. Mods are created by combining any number of mix-and-match steps called **✨ Bricks ✨.**

### Mods Panel Layout

At the top of the Mods Panel, there are three buttons:

1. The home icon takes you to a view where you can discover templates
2. The "New Mod" button is where you start building a new mod
3. The << button collapses the panel.

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2FlkjLP0IKzpFbFfppROiz%2Fimage.png?alt=media&#x26;token=304f5e92-d233-4ecb-a1b8-413c0fa1459e" alt=""><figcaption></figcaption></figure>

* **Home Button:** clicking the home button takes you to the Page Editor welcome message, showing helpful links and resources

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2FQo8O36kBbuO0bD6mVrx4%2Fimage.png?alt=media&#x26;token=6e0a35cb-ed01-44d1-bbe9-ba0e5c4f3244" alt=""><figcaption></figcaption></figure>

* **New Mod Button**: This is where it all begins! Clicking Add shows the starter bricks you can select for [types-of-mods](https://docs.pixiebrix.com/developing-mods/developer-concepts/types-of-mods "mention").
* **Collapse/Expand Button:** click to collapse the Mods Panel. You can re-expand the panel by clicking the button again.

Each mod listed has the following information and actions:

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2Fc5TV9s2uIgHmeVu7LP2C%2Fimage.png?alt=media&#x26;token=45b71250-47a9-4c5b-be43-6056d2e0ab12" alt=""><figcaption></figcaption></figure>

* **Icon:** indicates the type of starter brick
* **Name:** the name of the mod or mod package
* **Save Indicator/Button:** click the button to save changes. The button will only be enabled if there are unsaved changes
* **Action Menu** (three dots menu): a dropdown menu with the following actions:
  * Reset: resets any unsaved changes
  * Remove: remove a mod from your device. The mod will still be available from your PixieBrix account
  * Add to Mod: add the action/enhancement to a new or existing mod
  * Remove from Mod: remove an action/enhancement from a mod
  * Make a Copy: create a copy of the mod

### Search For a Mod

Mods are sorted alphabetically in the mod panel. Use the search bar below the Add button to search for the name of a mod instead of scrolling through your list.

<figure><img src="https://2274778196-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq123bF1HPQPV35s5vHa1%2Fuploads%2FyYc8NR5nwA8g6oZiC0yj%2FCleanShot%202024-10-24%20at%2018.44.08%402x.png?alt=media&#x26;token=a4d7df4e-f409-47f6-8e99-ad9b5987aa9e" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
If you want a mod to always appear at the top of the list, start the mod name with `A` or a symbol like `[`.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.pixiebrix.com/platform-overview/page-editor/page-editor-components/mod-listing-panel.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
