Creating a Module
Module Basics
Log in to the Manager, and click on the "Modules" icon on the welcome page, and click on New module.
Give your module a name and a description, then put a "stub" in the Module code field.
Run your new module!
As soon as you can see that the module is working, there is one thing that you should always do. The way that the MODx Manager works, you need to know the ID of the module in case you need to create a link back to itself; for instance, as the action of a form. Hover your mouse over the link to the new module in the module management screen, and make a note of the id in the URL.
Now, open the module for editing and go to the module's Configuration tab. Enter the module configration value for the module's ID, as you can see in the image below (use the ID number you saw in the URL mentioned above). Click on the button (or hit Enter) and you'll see how the configuration value can easily be changed. Save the module. Now you will be able to use that as a variable anywhere in the module you need it.
Making It Pretty
In its current state, the Manager uses frames. So your module's layout needs to be a full HTML document. Since this is the case, you can make it look any way you like. Run the modules you have installed, and you'll see different looks.
I chose to make my module look like the "manage modules" page.
There are two files that the MODx Manager uses for all of its main frames; manager/includes/header.inc.php and manager/includes/footer.inc.php. In the case of the module management frame, it uses the manager/actions/static/modules.static.action.php file. I "borrowed" the parts from these files that I wanted to provide the look-and-feel of the module. Since it's a module, and not a part of the Manager, the variables (such as which manager theme is being used by the site) are not available, but these values can be retrieved through the $modx object, which is available to modules. So instead of the variables you need to use $modx->config['manager_theme'] in the links for the css files.
<link rel="stylesheet" type="text/css" href="media/style/<?php echo $modx->config['manager_theme']; ?>/style.css" />
Do the same for links to the icons.
The Code
I chose to put all the module code in an external file and include it in the module itself. This way, the code can be simplified as an ordinary php file, with php tags used inside of plain HTML code instead of having to use HereDoc syntax or echo statements for the HTML. To make it easier, I added a modPath value to the module's configuration.
The rest of the files, the .js files for the AJAX functions and the server response for them are also in the assets/modules/dbmanage folder. Basically, you just use PHP and Javascript as you would for any web application. But that would be a topic for other articles.
Download the files used for this article.
