Inside of the plugin's folder, you'll find another folder called "menus". That's where all of your menu files should be. It is empty, of course, if you haven't made any menus.

The first step in making a menu is creating a file inside the menus folder. Create a new text file and rename it to your menu's name. Make sure the file's name ends with .yml (you won't see this in-game).

Examples of a valid file name: information menu.yml, Kits_Menu.yml, WEAPONS-menu.yml, warps.yml
Examples of an invalid file name: information menu, kits_menu yml, weapons-menu. yaml, warps.yml menu

Once you made your file, open it with your preferred text editor to start writing in it. Don't use Windows' default notepad program or Microsoft Word because they're not fit to doing what we need to do. A few popular text editors that you can use are: notepad++, atom, sublime.

The format that is used for making menus is YAML (or yml). This format is used a lot for plugins' config files so you probably know how to use it but if you don't, go learn it and return to this wiki.

To understand what we can do inside a menu file better, let's define "types" of objects that we can write inside our menu files:
Fields that you must include are marked with a **. The others are optional.

This object is a normal item. We can set its type, name, lore, amount, etc... An item can have the following fields:
material **: The type of the item. If your server uses an older version of Minecraft, you can also define the durability of the item
amount: The amount of the item. If you don't include this field, the item's amount will be set to 1.
name: The name of the item. If you want to use the vanilla name of the item, don't include this field.
lore: The lore of the item. If you don't want lore, don't include this field.
glow: When this field is set to true, the item will glow. The default value is false.
unbreakable: When this field is set to true, tools will hide their durability bars. The default value is false.

Example

material: RED_STAINED_GLASS_PANE # In older versions, replace this with STAINED_GLASS_PANE:14
name: "&cClose Button"
lore:
  - ""
  - "&7Click to Close"

This object is an animated item. We can add as many frames as we want and we can adjust the speed of the animation.
frames **: A list of static items that will act as frames.
ticks: The delay in ticks between each frame. The default value is 5.

Example:

ticks: 3
frames:
  - material: PINK_STAINED_GLASS_PANE
  - material: MAGENTA_STAINED_GLASS_PANE
  - material: PURPLE_STAINED_GLASS_PANE
  - material: MAGENTA_STAINED_GLASS_PANE

This is a clickable component that is displayed as an item. When clicked, it can execute actions and commands.
position **: The position of the button inside the current canvas. It can either be a slot or x, y values.
item **: The appearance of the button. It can either be an item or an animation.
action: The action that the item will perform when clicked (more information below).
permission: The required permission to press this button.
no-permission-message: The message that'll be displayed when the clicker doesn't have permission.
sound: The sound that is played when the button is clicked.
no-permission-sound: The sound that is played when the clicker doesn't have permission.
commands: The commands that the console will execute when the button is pressed.
sudo: The commands that the clicker will execute when the button is pressed.

Example:

position: 4, 2
item: my-custom-golden-apple-item
sound: BLOCK_NOTE_BLOCK_HARP 10 1
commands:
  - eco take %name 100
  - msg %name &aYou bought a golden apple for $100!

This component can contain other components inside of it. Please note that all of the components inside a canvas will move based on the canvas' position.
type: CANVAS **: You must include this to make the system know that your object is a canvas.
position **: The position of the button inside the current canvas. It can either be a slot or x, y values.
components **: A list of the canvas' components.

Example:

type: CANVAS
position: 0, 0
components:
  - type: BUTTON # You don't have to state the type of a button
    item: my-custom-item
    position: 4, 0
  - type: CANVAS
    position: 0, 1
    components:
      - type: BUTTON
        item: my-custom-item
        positions: [0, 1, 2, 3, 4, 5, 6, 7, 8]

Similar to canvases, lists hold components inside of them, but in the form of a list that you can scroll through (like switching a page or scrolling down on a list of items).
type: LIST **: You must include this to make the system know that your object is a canvas.
position **: The position of the button inside the current canvas. It can either be a slot or x, y values.
components **: A list of the canvas' components.
slots **: The list's slots.
tag: Used to assign buttons to scrolling actions. scroll: How many components should be skipped when scrolling through the list. If you leave this empty, it'll set to the number of slots, creating a "book" effect.
loop: Should the list loop through its components.

Example:

type: LIST
position: 0, 0
components:
  - item: my-first-item
  - item: my-second-item
  - item: my-third-item
slots: [0, 1, 2, 3, 4, 5, 6, 7, 8]
scroll: 1
loop: true

These are all of the components that we can use to make a menu.

Let's talk a little more about buttons. We can assign buttons to perform certain actions when clicked. The list of actions is very limited but can be expanded with additional plugins.
The most common action is the exit action. It closes the inventory when the button is pressed.
There are two more functions that are used for scrolling lists. To make a button perform a scroll action, your list must include a tag. You can set the tag to whatever you want. Once you have a tag, you can set the button's action to <tag>-forward or <tag>-backward to scroll forward and backward in your list.

All menu files must follow structure:

<Inventory Information>

<Items and Animations>

<Menu Components>

The first part you should do when making a menu is defining the inventory. We can do it by including these fields:
Fields that you must include are marked with a **. The others are optional.
title **: The title of the menu.
rows **: The number of rows inside the menu.
open-previous: Should the previous menu open when this one is closed.
open-sound: Plays when the menu opens.
close-sound: Plays when the menu closes.
switch-sound: Plays when switched to another menu.

Example:

title: "&8&lMy Menu"
rows: 4
open-previous: true
open-sound: BLOCK_NOTE_BLOCK_HARP 0.5 2
close-sound: BLOCK_NOTE_BLOCK_HARP 0.5 1
switch-sound: ITEM_BOOK_PAGE_TURN 0.5 1

This segment includes all of the items and animations that you will use in your menu. All of the items must be listed under the word items and they all need to have a key.
Example:

items:
  information-item:
    material: BOOK
    name: "&9Information"
    glow: true
  exit-button: # This is a key
    material: RED_STAINED_GLASS_PANE
    name: "&cClose Menu"
    lore:
      - ""
      - "&7Click to Close"
  animated-footer: # This is a key
    ticks: 3
    frames:
      - material: PINK_STAINED_GLASS_PANE
      - material: MAGENTA_STAINED_GLASS_PANE
      - material: PURPLE_STAINED_GLASS_PANE
      - material: MAGENTA_STAINED_GLASS_PANE

This is where you finally get to design your menu. The first thing you need to do is make the main canvas. You don't need to specify a position or a type this time.
Example:

canvas:
  components:
    - position: 4, 1
      item: information-item
      action: exit
      sudo:
        - help
    - type: CANVAS
      position: 0, 3
      components:
        - positions: [0, 1, 2, 3, 5, 6, 7, 8] # This is an alternative way to specify multiple positions
          item: animated-footer
        - position: 4
          item: exit-button
          action: exit

Let's take the segments from the previous section and put them together in one file:

title: "&8&lMy Menu"
rows: 4
open-previous: true
open-sound: BLOCK_NOTE_BLOCK_HARP 0.5 2
close-sound: BLOCK_NOTE_BLOCK_HARP 0.5 1
switch-sound: ITEM_BOOK_PAGE_TURN 0.5 1

items:
  information-item:
    material: BOOK
    name: "&9Information"
    glow: true
  exit-button:
    material: RED_STAINED_GLASS_PANE
    name: "&cClose Menu"
    lore:
      - ""
      - "&7Click to Close"
  animated-footer:
    ticks: 3
    frames:
      - material: PINK_STAINED_GLASS_PANE
      - material: MAGENTA_STAINED_GLASS_PANE
      - material: PURPLE_STAINED_GLASS_PANE
      - material: MAGENTA_STAINED_GLASS_PANE

      
canvas:
  position: 0
  components:
    - position: 4, 1
      item: information-item
      action: exit
      sudo:
        - help
    - type: CANVAS
      position: 0, 3
      components:
        - positions: [0, 1, 2, 3, 5, 6, 7, 8]
          item: animated-footer
        - position: 4
          item: exit-button
          action: exit

This is the result:

Congratulations, you made your first menu! The next page will teach you how to open it in-game!