Skip to main content

Modules

The Modules section allows you to install, manage, and configure MagicMirror modules on your Smart Mirror. Modules extend the functionality of the built-in interface — from weather widgets to calendar displays and custom dashboards.

⚙️ Note: The Modules section is only available if you selected the built-in interface during setup. If you chose a Custom URL, the mirror runs in kiosk mode and does not use the module system.


1. Accessing the Module Manager

  1. Open the web dashboard in your browser.
  2. In the top navigation bar, click Modules.
  3. You’ll see the integrated File Browser and Module Management panel.

The interface allows you to upload, clone, or manually add modules directly to your device.


2. File Browser Overview

The File Browser provides access to key directories of the Smart Mirror installation:

config/

Contains the main configuration file: config.js

  • Do not change the port.
  • You may change the address from localhost to 0.0.0.0 to make the mirror accessible from other devices in your network.
  • Clear the ipWhitelist array to allow connections from other devices.
  • You can preview the running mirror interface at port 8088 in your browser.
  • Any changes to module visibility or behavior must be made here.

💡 Important: The structure and syntax of config.js are identical to the original MagicMirror software. Refer to the official documentation for full details: 👉 https://docs.magicmirror.builders/modules/introduction.html

css/

Contains custom.css, where you can apply your own styles.

  • To maintain emoji support, keep the “Noto Color Emoji” font entries at the top of the file.
  • The rest of the CSS behaves like standard MagicMirror styling.

modules/

Contains all installed MagicMirror modules. Each module has its own folder inside this directory.


3. Installing Modules

There are three supported ways to install new modules.

3.1 Install via GitHub

  1. Click the GitHub icon in the top bar of the Modules view.

  2. Select Install and enter the repository URL.

    • The system will clone the repository directly into the /modules directory.
  3. To update all Git-based modules later, click Update.

    • This fetches the latest version of each cloned module.

3.2 Install via ZIP Upload

  1. Click the Upload button.
  2. Select a .zip file containing the module.
  3. The system automatically extracts the contents into the /modules directory.

⚠️ Depending on your network speed and device performance, extraction may take a few minutes.


3.3 Manual Installation

  1. Create a new folder inside /modules.
  2. Upload or create the necessary module files manually.
  3. Always update config/config.js to include the new module — otherwise it will not appear in the mirror view.

Again, see the MagicMirror module documentation for syntax and examples.


4. Additional Notes

  • The File Browser supports drag and drop, allowing direct file uploads and replacements.
  • From the language settings onward, the behavior matches the original MagicMirror software.
  • Use port 8088 to preview what the mirror currently displays.
  • Avoid unnecessary edits to system files outside config, css, or modules.
  • For troubleshooting, module configuration examples, and best practices, refer to the official documentation: 👉 https://docs.magicmirror.builders/