Adjusting the component's look and feel through template overrides

Every Joomla! extension comes with a default frontend view for each of its features (menu items - for components - and modules). However, depending on your template's design, it is very likely that you will need to make some modifications to the extension's views in order to keep a consistency, with the template, in terms of look and feel.

Template Overrides

When performing such modifications, the biggest concern is losing them when updating the component. Joomla! was developed having this into account, allowing you to load modified copies of view files instead of the original ones, keeping the modifications safe from being overwritten on updates - this process is called template overrides.

Since these views need to be adapted to the template you are using, it is required that they be associated with it. Each Joomla! template has a folder destined for this purpose, called html. In this folder, you will need to partially recreate the folder structure of the original file's location and place the modified copy inside it, so that the template can identify the exact view it should replace with the overridden one.

Example

The best way to explain how this is done is through a real-life example. Let's assume that you wish to modify how a Joomla! Content article is being displayed on Joomla!'s Beez_20 template.

This type of view is controlled by the following file:

/components/com_content/views/article/tmpldefault.php

To perform a template override for it, you will need to create the following folder structure:

/templates/beez_20/html/com_content/article/

copy the default.php file here and then perform your desired modifications.

 
RSMediaGallery!'s views

All you need now (aside from some coding knowledge) to create template overrides for RSMediaGallery!'s menu items (views) is to know which files control them and where they are located. RSMediaGallery! currently offers 2 menu items, each having 2 separate types of layouts, one for normal display and one with responsive capabilities, both configurable in the menu items' configuration areas: Albums Layout and Gallery Layout. Their views are being controlled by the following files:

 
The Albums Layout menu item

This menu item has 2 views of its own: the albums listing and the album details view. Each of them has a normal layout and a responsive one:

Albums listing

  • normal layout: - /components/com_rsmediagallery/views/albums/tmpl/default_normal.php
  • responsive layout: - /components/com_rsmediagallery/views/albums/tmpl/default_responsive.php

Details view

  • normal layout: - /components/com_rsmediagallery/views/album/tmpl/default_normal.php
  • responsive layout: - /components/com_rsmediagallery/views/album/tmpl/default_responsive.php
 
The Gallery Layout menu item

This menu item's normal and responsive layouts are being controlled by the following files:

  • normal layout: - /components/com_rsmediagallery/views/rsmediagallery/tmpl/default_normal.php
  • responsive layout: - /components/com_rsmediagallery/views/rsmediagallery/tmpl/default_responsive.php

2 persons found this article helpful.


Was this article helpful?

Yes No
Sorry about that

You Should Also Read

Setup HOT

The Gallery Layout menu item

What is RSMediaGallery! ?

Integrate RSMediaGallery! with your own extension

The Albums Layout menu item