Building Themes for Aikeedo
Creating a custom theme for Aikeedo allows you to personalize the look and feel of your platform. This guide will walk you through the process of building a theme, from setting up the directory structure to activating your new theme.Getting Started
1. Create the Theme Directory
First, create a new directory for your theme in the/public/content/plugins
directory of your Aikeedo platform. Use the following structure: yourorganization/theme-name
.
For this guide, we’ll create a theme called “Orbit”:
2. Set Up the Composer Package
Aikeedo themes are Composer packages, which require acomposer.json
file for metadata and dependencies.
Create a composer.json
file in your theme directory. Here’s a minimal version that’s sufficient for a functional theme:
The
type
attribute must be set to aikeedo-theme
. This is crucial for Aikeedo to recognize and properly handle your package as a theme.composer.json
file, you can use the following extended version:
The
name
field in composer.json
must match the path to your theme directory (e.g., heyaikeedo/orbit
). This uniquely identifies your theme.Start with the minimal version and expand your
composer.json
file as your theme grows and requires more detailed information. Remember to always keep the type
set to aikeedo-theme
.3. Create the Main Template
Aikeedo uses the Twig templating engine to render pages. Create atemplates/index.twig
file in your theme directory with a basic HTML structure:
Use the
@theme
Twig namespace to load theme assets in your templates.Activating Your Theme
- Access the Themes page in the Aikeedo admin UI.
- Locate your new theme (Orbit).
- Click the “Activate” button to enable your theme.
Further Development
Now that you have the basic structure in place, you can start customizing your theme. Here are some tips for further development:- Frontend Tooling: Choose a frontend build tool that suits your workflow. We recommend using Vite for its speed and ease of use.
- Theme Objects: Aikeedo provides several objects that you can use in your themes. Refer to the Theme Objects section in the documentation for details on available objects and their properties.
- Default Theme: For inspiration and best practices, take a look at the Default Aikeedo theme.
Best Practices
- Responsive Design: Ensure your theme looks good on all device sizes.
- Accessibility: Follow web accessibility guidelines to make your theme usable for everyone.
- Performance: Optimize your assets and use caching techniques to keep your theme fast.