How to override css file

If want to change some style of an element, then you can override it's css.

To override the css file follow the steps :

  • You need to create a new css file at root/media or root/media/css folder or any other folder wherever you want.

  • Copy the content of file at path root/components/com_payplans/templates/default/_media/css/site.css to your newly created file.

  • Do the required changes in that file and save it.

After that you have to change the line which loads site.css. site.css file is mentioned in the default_assets.php. The path of the file is

Now, in order to not loose the changes done in default_assets.php file, use Template Overriding to make the changes.

The path where you have to keep the default_assets.php will be

In the default_assets.php, you have to comment the line for loading the site.css file and load the new css file.

  • Follow the same steps, if you want to write your own new css file. Just create new css file, and define its path in the default_asset.php file

NOTE:- While overriding the default_asset.php, you also have to copy the site.js file which is present at path:- root/components/com_payplans/templates/default/_media/js/site.js file to the template override folder. So, new path of site.js file should be [br] [br] Joomla_root/templates/YOUR_TEMPLATE/html/com_payplans/_media/js

You have to copy site.css also in case if you are creating your own custom.css file. The path for site.css will be root/components/com_payplans/templates/default/_media/css
Copying .js(or .css) file is important as it will not get loaded when overriding is done.