Panel/Website/docs

Documentation System

Overview

The billing module now includes a flexible documentation browser that organizes documentation into categories with an easy-to-navigate interface.

Structure

Documentation is organized in the /modules/billing/docs/ folder with the following structure:

docs/
├── category-name-1/
│   ├── index.php          (Required: Documentation content)
│   ├── metadata.json      (Required: Category and ordering info)
│   └── icon.png or icon.jpg (Required: Category icon)
├── category-name-2/
│   ├── index.php
│   ├── metadata.json
│   └── icon.png
└── ...

Creating New Documentation

1. Create a Folder

Create a new folder in /modules/billing/docs/ with a descriptive name (lowercase, hyphens for spaces):

mkdir /modules/billing/docs/my-new-doc

2. Create metadata.json

This file defines how the documentation appears in the list:

{
    "name": "My Documentation Title",
    "description": "A brief description of this documentation",
    "category": "game",
    "order": 10
}

Fields:

• name: Display name shown in the documentation list
• description: Brief description shown on the card
• category: One of: game, panel, mods, troubleshooting, other
• order: Sort order within the category (lower numbers appear first)

3. Create index.php

This file contains the actual documentation content. Use PHP and HTML:

<?php
/**
 * My Documentation
 */
?>
<h1>My Documentation Title</h1>

<h2>Section 1</h2>
<p>Your content here...</p>

<h3>Subsection</h3>
<ul>
    <li>Item 1</li>
    <li>Item 2</li>
</ul>

<h2>Code Examples</h2>
<pre><code>
# Your code here
command --option value
</code></pre>

The documentation system automatically styles:

• Headings (h1-h4)
• Links (styled with accent color)
• Code blocks (with dark background)
• Lists and other HTML elements

4. Add an Icon

Add either icon.png or icon.jpg to the folder. Recommended size: 60x60 pixels or larger (will be scaled down).

If no icon is provided, a default document emoji (📄) will be shown.

Categories

Documentation is organized into these categories:

• game - Game-specific server guides
• panel - Panel usage and features
• mods - Mods and addon documentation
• troubleshooting - Problem-solving guides
• other - Miscellaneous documentation

Categories are sorted and labeled automatically on the documentation page.

Example Documentation

See the included examples:

1. minecraft - Game server documentation example
2. getting-started - Panel documentation example
3. common-issues - Troubleshooting documentation example

Accessing Documentation

Users can access documentation at:

• /modules/billing/docs.php - Main documentation list
• /modules/billing/docs.php?action=view&doc=folder-name - Specific doc

A "Documentation" link is added to the main navigation menu.

Best Practices

1. Keep it Organized: Use clear, descriptive folder names
2. Consistent Naming: Use lowercase and hyphens (e.g., my-game-guide)
3. Good Descriptions: Write helpful metadata descriptions
4. Visual Icons: Use recognizable icons for each category
5. Test Content: Preview documentation after creating it
6. Regular Updates: Keep documentation current with panel changes

Migration from Old System

The old docs folder with game markdown files has been moved to /modules/billing/docs_old/ for reference. The new system provides:

• Better organization by category
• Consistent styling
• Easier navigation
• Extensible structure for any type of documentation

To migrate old documentation:

1. Create a new folder for each document
2. Convert markdown to HTML in index.php
3. Add appropriate metadata.json
4. Add an icon image

Troubleshooting

Documentation not appearing

• Check that folder has all three required files (index.php, metadata.json, icon)
• Verify metadata.json is valid JSON
• Ensure file permissions allow reading

Styling issues

• The system uses inline styles from docs.php
• Custom styles in index.php may conflict
• Keep content semantic (use proper HTML tags)

Icons not showing

• Check file exists and is named exactly icon.png or icon.jpg
• Verify image file is not corrupted
• Try a smaller image size if very large