# Custom Pages

## Setup

To achieve this, you need to create a page file named anything you want inside the `pages` folder in the `data` folder.  The `data` folder is located in the root folder of Organizr.

Once you have created a blank page, you may paste this skeleton code to get you started:

```php
<?php
/*
 * Make sure to edit "name_here" with your page name - i.e. custom_code_presentation
 * You will edit on both "$GLOBALS['organizrPages'][] = 'name_here';" and "function get_page_name_here($Organizr)"
 */
$GLOBALS['organizrPages'][] = 'name_here';
function get_page_name_here($Organizr)
{
	if (!$Organizr) {
		$Organizr = new Organizr();
	}
	/*
	 * Take this out if you dont care if DB has been created
	 */
	if ((!$Organizr->hasDB())) {
		return false;
	}
	/*
	 * Take this out if you dont want to be for admin only
	 */
	if (!$Organizr->qualifyRequest(1, true)) {
		return false;
	}
	return '
			<script>
				// Custom JS here
			</script>
			<div class="">
				<div class="col-lg-12">
					<div class="panel bg-org panel-info">
						<div class="panel-heading">
							<span lang="en">Template</span>
						</div>
						<div class="panel-wrapper collapse in" aria-expanded="true">
							<div class="panel-body bg-org">Ayyy.... yooo...!
							</div>
						</div>
					</div>
				</div>
			</div>
		';
}
```

* You need to change the first instance of `name_here` on the `GLOBALS` variable. &#x20;
* Also make the change on the function name.
  * They need to be the exact same words.
* If you need DB Access, keep the if statement that has the `hasDB` method.
* If you need to check access by group, leave or change the first parameter in the `qualifyRequest` method to the cooresponding group ID
* Make the changes to the return with your code.

## Accessing Tab

Once you have the code setup, you may access it via API or via Tab Editor.

### API

## This Endpoint will list all pages available

<mark style="color:blue;">`GET`</mark> `https://organizr-url/api/v2/page`

{% tabs %}
{% tab title="200: OK " %}

```
{
    "response": {
        "result": "success",
        "message": null,
        "data": [
            "dependencies",
            "error",
            "homepage",
            "lockscreen",
            "login",
            "settings_customize_appearance",
            "settings_customize_settings",
            "settings_image_manager",
            "settings_plugins_disabled",
            "settings_plugins_enabled",
            "settings_plugins_settings",
            "settings_plugins",
            "settings_settings_backup",
            "settings_settings_logs",
            "settings_settings_main",
            "settings_settings_sso",
            "settings_tab_editor_categories",
            "settings_tab_editor_homepage_order",
            "settings_tab_editor_homepage",
            "settings_tab_editor_tabs",
            "settings_template",
            "settings_user_manage_groups",
            "settings_user_manage_users",
            "settings",
            "tabs",
            "settings_wizard",
            "name_here"
            
            
        ]
    }
}
```

{% endtab %}
{% endtabs %}

## Displays the code of your custom page

<mark style="color:blue;">`GET`</mark> `https://organizr-url/api/v2/page/name_here`

{% tabs %}
{% tab title="200: OK " %}

```
{
    "response": {
        "result": "success",
        "message": null,
        "data": "\r\n\t\t\t<script>\r\n\t\t\t\t// Custom JS here\r\n\t\t\t</script>\r\n\t\t\t<div class=\u0022\u0022>\r\n\t\t\t\t<div class=\u0022col-lg-12\u0022>\r\n\t\t\t\t\t<div class=\u0022panel bg-org panel-info\u0022>\r\n\t\t\t\t\t\t<div class=\u0022panel-heading\u0022>\r\n\t\t\t\t\t\t\t<span lang=\u0022en\u0022>Template</span>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t<div class=\u0022panel-wrapper collapse in\u0022 aria-expanded=\u0022true\u0022>\r\n\t\t\t\t\t\t\t<div class=\u0022panel-body bg-org\u0022>Ayyy.... yooo...!\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t"
    }
}


```

{% endtab %}
{% endtabs %}

### Tab Editor

Create a new tab just like this

<figure><img src="/files/bTSlP8nhNM2djInptlWJ" alt=""><figcaption></figcaption></figure>

The Tab URL will be as follows: `api/v2/page/name_here` where `name_here` is the name of your new custom page.

After you have saved the tab, change the Tab Type to `Organizr` and enable the tab.

<figure><img src="/files/StXoLj6qpIQRwzL9VQwd" alt=""><figcaption></figcaption></figure>

### Enjoy

That's it!  Enjoy your new Custom Tab...


---

# 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.organizr.app/help/custom-work/custom-pages.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.