My Super User

In Joomla 4+, core templates consist of the following areas:

  • Template Directory (pages, layout overrides)
  • Template Assets (css, js)
  • Language Files

Template Directory

Template directory files are found under 'templates/<yourtemplatename>'

For this site, they would be found under 'templates/mytemplate'

The easiest method for creating new layout overrides for components, plugins, modules, and system layouts using this site as the example:

  • Log in to your Joomla Administrator dashboard
  • System > Site Templates > Mytemplate Details and Files
  • Click the 'Create Overrides' tab
  • Select the item(s) you wish to create a new layout override file for.
  • Pay attention to the top message, it will show you the exact location you will find the new file.
  • All override files will be created in your html directory found under 'templates/mytemplate/html'

Template Assets

Template assets such as css and js files can be found under your media folder 'media/templates/site/mytemplate'

These assets are controlled by the new Joomla Web Asset Manager that gives you full control over any css or js file that is loaded on your site (as long as the 3rd party extensions you load are built to Joomla 4+ standards). The files and the order in which they appear can be loaded in-line (not recommended for files that load on all pages) or with the new joomla.asset.json file found under your 'template/mytemplate' directory.

Language Files

Language files that are specific to the current template can be found under 'language/en-GB/tpl_mytemplate.ini' and 'language/en-GB/tpl_mytemplate.sys.ini'.

If you use a different language than English, your language files would be located in the language specific directory.

These language strings can control new language strings you create for your template as well as language strings found in your template settings for any custom fields or fieldsets you create for your template.

Conclusion

All three aspects above are used extensively throughout the creation of this custom template.