In this article, we’ll explore how artificial intelligence can be integrated into a CMS environment - specifically Joomla CMS - to create complete websites quickly and flexibly. We’ll also walk through a demonstration where AI is used to generate two different websites inside Joomla. This article is intended primarily as inspiration and as a starting point for discussion about the possible directions Joomla CMS could take when working with AI. The system shown here is just one of many potential ways AI and a CMS could collaborate.
Watch the video below to see how Joomla CMS, together with several specialized extensions, could be used to build two example websites from start to finish.
As we mention in the video, an important aspect of combining AI with a CMS is that creating a website with AI is only the first step. We also need to be able to modify the site, make adjustments, add new features, or integrate ready-made solutions. This is where the CMS plays an irreplaceable role.
The Tools We’ll Use
Alongside Joomla CMS itself, we’ll be using three key extensions from Phoca:
- Phoca AI Component - a component that connects Joomla to AI models and helps generate both content and design.
- Phoca AI Template - a Joomla template serving as the base for all generated layouts.
- Phoca Particles Module - a module for creating individual Joomla modules systematically.
The Test Prompts
For our demonstration, we’ll give AI two different prompts:
1. Software Developer Website
"Freelance software developer. There will be a comparison table with three main pricing plans: Basic, Standard, and Pro. The site should include menu links like Portfolio, Services, and Contact. The developer is called 'Spectrum' and offers software development. The page should contain bold colors."2. Restaurant Website
"Restaurant website that specializes in selling pasta, pizza, fish, and salads. There should be menu links like Menu, Order Online, and Find Us."In each case, the prompt is sent to the AI, which then generates the website directly inside Joomla - complete with initial layout, structure, and styling.
The Role of the CMS
AI gives us a strong starting point by generating the basic structure and design. The CMS - in this case Joomla - then takes over as the main platform for editing, expanding, and integrating specialized extensions for specific needs.
This collaboration between AI and CMS can take many forms:
- Single Prompt for the Entire Website
Simple to set up, but harder to fine-tune individual sections. - Chat-based Editing
A conversational approach that allows precise control over each element, but requires more computing resources. - Multiple Prompts for Individual Sections
Useful for Joomla page builders - each block or section could have its own tailored prompt for maximum flexibility.
Choosing the Right Environment
The environment in which the CMS runs plays a crucial role. The setup shown in our demo is best suited for a SaaS-type environment, because it relies on three different technologies working together:
- PHP, Apache, SQL, JavaScript (browser) - the CMS backbone.
- Node.js - server-side JavaScript, used here mainly for compiling and optimizing assets.
- Python with Flask - for communication with local AI models.
Such an environment is rarely available on typical shared hosting. However, all is not lost - Node.js could be replaced by PHP for certain tasks, and AI queries could be sent to external services. With the right adjustments, this system could run even on shared servers.
Technical Breakdown of the Demonstration Setup
To replicate what you see in the video, the following would be needed on a single server or machine:
- Apache - serving PHP and MySQL.
- PHP - core CMS logic.
- MySQL/MariaDB - database storage.
- JavaScript - a bridge between PHP and Python; PHP assembles prompts, sends them to JS, which forwards them to Python (Flask), then processes and stores responses.
- Node.js - a simple tool for compiling SCSS and JavaScript, minifying files, gzipping, and generating RTL versions.
- Python with Flask - handling communication with local AI model.
Design Flexibility
Design is one example where a CMS can help us be more flexible.
While AI tools might allow us to change the design only through prompts, combining AI with a CMS opens up more possibilities:
- Not only through prompts
- But also by adjusting SCSS variables and recompiling CSS files
- Or overriding styles in a user.css file directly from the template
- Or Using built-in template parameters (a common feature in Joomla templates)
- And more.
All of this gives us a wider range of options and greater flexibility.
AI vs. Pre-Prepared Assets
A key decision is deciding what to let AI create from scratch and what to base on pre-prepared datasets.
Example: Color Schemes
Do we allow AI to generate colors freely, or do we supply professionally designed palettes and let AI choose the most appropriate one?
Example: Images
We can let AI generate them, or we can provide a curated dataset. However, in most real-world cases - such as restaurants - custom photography is essential. A restaurant will almost always want to feature images of its actual interior and dishes rather than entirely AI-generated visuals.
Conclusion
The integration of AI into a CMS like Joomla opens up exciting possibilities for rapid website creation. Whether you opt for fully automated generation or a hybrid approach with human-curated assets, the combination of AI’s creative speed and Joomla’s customization power can significantly accelerate the development process while maintaining full creative control.