How to Edit Joomla 4 Template Files

Introduction

Just like Joomla 3, Joomla 4 also comes with a built-in template editor located inside the admin panel. This way you can edit your templates directly in the backend, right in your web browser. This is also more secure and convenient than having to use a third-party utility or an intermediary tool like FTP clients. This feature has been implemented in the Joomla 3 series and is now followed by Joomla 4 with numerous interface and feature improvements.

In this tutorial, I will show you how to modify/edit template files in Joomla 4.

How to Edit Template Files in Joomla 4

Access the Template Manager

In order to access the Template Manager, you need to first log in to the Administrator (back-end) to visit the Home Dashboard.

From the Home Dashboard, click System.

You’re in the System page. You can now see the Templates settings. Click on either Site Templates or Administrator Templates to visit the particular template manager.

Here, click Site Templates to access the template manager for your site templates that are currently available.

Here it is, the Template Manager (Site):

Open / Edit Template Files

Before modifying template files, please keep the following in mind:

• Better make changes/edits to a copy of your template, instead of the one currently in use.
• Future updates may make changes to the core Joomla template files, which must be replicated in your edited version.
• Make sure to create a backup of the original file before making changes.

Now, click on a template name or title you wish to modify to open its details and files.

For example, I will open the default template (Cassiopeia) which will change the view to Templates: Customise (Cassiopeia) view (as shown in the screenshots below).

On the Editor tab on the left side, click on any of the files and you will be able to edit the corresponding file directly in your browser.

You can edit the following files:

index.php – edit the main page template
error.php – edit the error page template
component.php – edit the print view
css/template.css – edit the template.css file inside the CSS folder

Remember to click Save or Save & Close when you’re done!

Create New Files

To create a new template file, simply click the New File button from the toolbar at the top.

Here, you can select a file type to create a new file or upload one from your local storage. Note that the maximum allowed upload size is ‎10 MB.

Rename Template Files

To rename a file, open the file by clicking on it, then click the Rename File button at the top.

Now, provide a new name and click the Rename button to apply.

Delete Template Files

Much like the above steps, simply open the corresponding file you wish to delete and click the Delete File button at the top.

A dialog box appears asking to confirm the deletion, hit Delete to proceed or Close to cancel.

Create New Folders

With the Manage Folders option (select from the toolbar), you will be able to create new folders inside your current template.

Delete Template Folders

With the Manage Folders window still open, simply select a folder on the left and then hit the Delete button at the bottom right to perform the deletion. Please note that this action cannot be undone (irreversible), so make sure you know what you are doing!

Copy the Template

Back in the Templates: Customise (Cassiopeia) view, from the toolbar at the top, click Copy Template button to make a copy of your existing template.

A dialog box appears. Here, enter a new template name, then click Copy Template and you will then get a complete copy of the currently open template.

Also from the top toolbar, click the Template Preview button and you will immediately see a preview of your template on the front-end.

That’s it! You now know how to manipulate template files in Joomla 4.

Conclusion

So, through this tutorial, you have learned how to modify/edit template files as well as perform other template operations in Joomla 4. Hope this article. was helpful. Don’t hesitate to leave us your comments should you have any questions. Besides, check out our awesome Joomla 4 templates to get your own responsive, high-performance, and SEO-optimized websites. Thanks for reading! 🙂

Rate for post

The post How to Edit Joomla 4 Template Files appeared first on LTHEME.