File Structure

This section will show you how to keep your files organized. Our theme file structure that looks like this.

Theme folder and file structure

As mentioned previously, the default Geeks themes are some of the best examples of good theme development.

For instance, here is how the Geeks Theme organizes its file structure:

  • Geeks

    Folder contains all template source and production files.

    • node_modules

      Directory where npm installs dependencies.

    • src

      This folder holds all template source files and folder.

      • assets

        • css

          Compiled CSS

        • fonts

          All fonts are used in the theme.

        • images

          All the images are used in the theme

        • js

          All Javascript source files used in theme.

        • plugins

          All node_modules source files generate here and used it theme.

        • scss

          All SASS file and folder included in it

      • partials

        A specific loop header and footer files for the templating.

      • index.html

        All page here but entry page is index.php

    • bun.lock

      Lock file generated by Bun that records the exact versions of installed dependencies to ensure consistent package installation.

    • package.json

      Configuration file for Node.js and npm. It manages project dependencies and scripts used to run npm i tasks and build assets.