> For the complete documentation index, see [llms.txt](https://docs.crystxlz.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.crystxlz.com/resources/menu-default.md).

# Menu Default

This is the installation and customize guide for Crystal Menu Default

## Step 1: **Download and Extract**

**Download the resource and extract the `.zip` file into your `resources` folder.**

**Ensure the resource by adding it to your `server.cfg`:**

```
ensure crystal-menu-default
```

**Alternatively, you can ensure the folder containing this resource if it’s inside a resource container.**

## **Step 2: Configuration**

**Config File Overview**

**Below is a detailed explanation of the configuration options for Crystal Menu Default.**

```lua
-- Configuration Settings for Crystal Menu Default

Config = {}

-- [UI Color]
-- This is where you define the primary color for the user interface.
-- The color should be in HEX format, like "#8c80f0".
-- You can use any valid HEX color code, and there are online tools to help you find one.
Config.Color = '#8c80f0'

-- [Menu Position]
-- This setting determines where the menu will appear on the screen.
-- Available options are:
-- 'top-left', 'top-center', 'top-right', 'center-right',
-- 'bottom-right', 'bottom-center', 'bottom-left', 'left-center'.
-- Choose the position that best fits your layout and design preferences.
Config.Position = 'center-left'

-- [Banner Image]
-- This setting allows you to specify a banner image for the menu.
-- Provide a local path (e.g., "images/image.png") or a web URL (e.g., "https://example.com/banner.png").
-- Set the value to 'nil' if you do not wish to display any banner.
Config.Banner = nil

-- [Auto Resize]
-- This setting controls whether the options section of the menu resizes dynamically based on its content.
-- When set to 'true', the menu's options area will automatically adjust its size to fit the items within it.
-- If set to 'false', the menu's options area will have a fixed size regardless of the content.
Config.AutoResize = false
```

## Step 3: Setting Up Exports

```lua
exports['crystal-menu-default']:openMenu(id, title, options, actions, onClose)
```

**Params:**

* id: `string | number`
  * Unique menu identifier, will be used to open the menu.
* title: `string`
  * Title display in the menu; has markdown support.
* options: `table (array)`
  * item: `table (object)`
    * title: `string`
    * description: `string`
    * icon: `string`
    * action: `table`
      * name: `string`
      * args: `any`
    * events: `table (object)`
      * client: `table (object)`
        * key (event name): `string`
          * value: `any`
      * server: `table (object)`
        * key (event name): `string`
          * value: `any`
    * autoClose: `bool`
* actions: `table (object)`
  * key (action name): `string`
    * value: `function`
* onClose: `function`

## Usage Example:

```lua
-- exports['crystal-menu-default']:openMenu(id, title, options, actions, onClose)

exports['crystal-menu-default']:openMenu('personalInfo', 'Personal Info', {
  {
    title = 'Name & Surname',
    description = 'Player Name | Player Surname',
    icon = '', -- Provide a local path (e.g., "icons/icon.png") or a web URL (e.g., "https://example.com/icon.png").
  },
  {
    title = 'Switch Job',
    description = 'Set the secondary job as main',
    icon = '',
    action = {
      name = 'switchJob'
    },
    autoClose = true
  }
}, 
{
  ['switchJob'] = function () return true end
}, function()
  print('Menu closed.')
end)

```