With this article I would like to provide you with a simple tutorial on Joomla template overrides. As a Joomla website owner you might be in a situation that you would like to modify some of the HTML output on your page. We have seen that occasionally Joomla core files were modified but this is typically the wrong approach since Joomla template overrides were specifically designed for such situation.
How is the HTML output in Joomla defined?
Your Joomla website consists of components, modules and plugins that determine the output in the frontend. Most of the appereance of your website is controlled in your Joomla template. You can freely modify the HTML structure of your page and can control the JavaScript and CSS. However, some of the HTML output comes directly from Joomla components and modules. Joomla extensions typically follow the MVC design pattern where the view determines the output. With Joomla template overrides you can adjust the view of Joomla components and modules.
What are Joomla template overrides?
Joomla template overrides allow you to adjust the view and output of Joomla components and modules without touching any of the Joomla core files.
In order to override output you simply need to place a php file in your template location:
/templates/[TEMPLATE]/html/[EXTENSION]/[VIEW]/[FILE].php
Instead of the default view file of your Joomla extension it uses then the php file that you have created in your template html folder.
Example for a Joomla template override
Avoid modifications of Joomla core files
Of course you could achieve the same output by simply modifying standard Joomla files. However, this should be avoided since it will likely cause issues in the future: Once you update your Joomla installation your changes might be overwritten and simply get lost.