Tablo templates are built as Kirby plugins to ensure they are easy to maintain, update, and customize without altering the core files. This approach keeps your customizations separate from the template's code, making it simple to apply updates without losing your work.

Core Structure

While the overall project follows the standard Kirby CMS file structure, the core of each Tablo template is located within the site/plugins/tablo-theme/ directory. This is where you will find the main assets, templates, and logic.

However, each Tablo template consists of multiple plugins working together. While tablo-theme/ serves as the main plugin, additional specialized plugins provide different functionality depending on the specific requirements.

site/
├── config/
│   └── config.php          # Main configuration file
├── plugins/
│   ├── tablo-theme/        # Main template plugin
│   │   ├── assets/         # CSS, JS, and other assets
│   │   ├── snippets/       # Twig template files
│   │   ├── templates/      # Twig template files
│   │   └── index.php       # Plugin registration
│   ├── tablo-fields/       # Custom field types
│   ├── tablo-icons/        # Icon management
│   ├── tablo-ogimage/      # Open Graph image generation
│   ├── tablo-robots/       # Robots.txt management
│   ├── tablo-sitemap/      # XML sitemap generation
│   └── tablo-twig/         # Twig templating engine
└── snippets/               # Custom template overrides (optional)
└── templates/              # Custom template overrides (optional)

Each template may include different combinations of these plugins based on its specific functionality needs, ensuring a modular and efficient approach to development.

Configuration

The site/config/config.php file contains the general Tablo configuration options. This is where you can customize various aspects of your template's behavior, appearance, and functionality, as well as manage basic translations and phrases under the tablo.theme namespace.

Templating & Customization

Tablo templates are built using Twig templating language, which makes them highly flexible and easy to customize. Twig provides a clean, readable syntax that simplifies development and maintenance.

To customize your template, simply place your own template or snippet files in the standard Kirby directories (site/templates/ or site/snippets/). These custom files will automatically override the default behavior, allowing you to modify any aspect of your site's appearance or functionality without touching the core files.

Development & Asset Building

Each Tablo release includes a package.json file and src/ directory that reference Tailwind CSS and esbuild for JavaScript processing. This development setup allows you to customize and rebuild the assets according to your needs.

To modify the styles and scripts:

1. Install or update dependencies in your development environment
2. Make changes to the source files in the src/ directory
3. Rebuild the assets, which will update the compiled files located in site/plugins/tablo-theme/assets/

This workflow gives you complete control over the appearance and functionality while maintaining a clean, organized development process.