Support

Documentation Akeeba Backup – User's Guide

Customising the front-end layout

Layout customisation usually involves either changing just the CSS or changing both the CSS and HTML output of the component. Both can be accomplished with template overrides. We will explain the two procedures below.

[Warning]Warning

Newer versions of the component may introduce changes to the base CSS and/or Javascript files or the HTML output. We recommend you to review your overridden files every time you upgrade Akeeba Ticket System. We will not accept bug reports or provide any hsupport if you are using template or media files overrides on your site as you are no longer running our tested code against our tested layout and our tested Javascript. If you want our help please make sure you can reproduce the issue without any template or media overrides.

Customising the CSS

  1. Find your current template's subdirectory in your site's root, under the templates directory. In this example, we will assume it is templates/mytemplate

  2. Create a new directory templates/mytemplate/media/com_ats/css This is your media files overrides directory.

  3. Copy the CSS files you want to modify from media/com_ats/css into the templates/mytemplate/media/com_ats/css directory. From now on, Akeeba Ticket System will load these new CSS files instead of the files found under media/com_ats/css.

  4. Edit the CSS files in templates/mytemplate/media/com_ats/css replacing or adding CSS rules so that the design matches your desired style

Please don't ask us for CSS or design ideas. We are good developers and horrid designers. You can ask us, however, regarding any issues you might experience overriding our CSS files.

Customising the Javascript

  1. Find your current template's subdirectory in your site's root, under the templates directory. In this example, we will assume it is templates/mytemplate

  2. Create a new directory templates/mytemplate/media/com_ats/js This is your media files overrides directory.

  3. Copy files from media/com_ats/js into the templates/mytemplate/media/com_ats/js directory. From now on, Akeeba Ticket System will load these new files instead of the files found under media/com_ats/js.

  4. Edit the files in templates/mytemplate/media/com_ats/js and adjust the JS code to your liking.

Customising the HTML output

Sometimes it's not enough modifying the CSS. In order to achieve your desired styling you may also have to add some extra div or span elements in the HTML output. When this happens you need to perform template overrides for our view template PHP files, a process called Template Overrides in Joomla! jargon. Instead of reinventing the wheel by writing lengthy instructions, we think it's better for you to read the official Joomla! documentation on the subject.

Overriding the loading of Bootstrap / jQuery

Akeeba Ticket System uses the Akeeba Strapper library to load its own copies of Bootstrap and jQuery on Joomla! 2.5 or its Bootstrap overrides in Joomla! 3. If you have a Joomla! 2.5 site which uses Bootstrap 2.x or a Joomla! 3 site which doesn't use Bootstrap 2.x (e.g. it uses Foundation Zurb, Bootsrap 3.x or something in the like) or if you are loading jQuery on your own (e.g. from a CDN) you MUST tell Akeeba Strapper what to load and when. You can do this through media overrides.

  1. Find your current template's subdirectory in your site's root, under the templates directory. In this example, we will assume it is templates/mytemplate

  2. Create a new directory templates/mytemplate/media/akeeba_strapper This is your Strapper media override directory.

  3. Copy the file media/akeeba_strapper/strapper.ini into the templates/mytemplate/media/akeeba_strapper directory. From now on, Akeeba Strapper will consult this new strapper.ini file instead of the file found under media/akeeba_strapper to decide what to load.

  4. Edit the templates/mytemplate/media/akeeba_strapper/strapper.ini file and change the Bootstrap and jQuery loading rules.

[Important]Important

These settings apply for all components using Akeeba Strapper. This includes all components with a front-end part released by Akeeba Ltd (e.g. Akeeba Subscriptions, Akeeba Ticket System or Akeeba DocImport) as well as a few third party components (e.g. Twentronix Cookie Confirm).

Overriding the CSS or JS loaded by Akeeba Strapper

Akeeba Strapper also loads its own CSS and Javascript files. You can override them as explained in the "Customising the CSS" and "Customising the Javascript" sections above. The source directories for Akeeba Strapper's files can be found under media/akeeba_strapper.

Still need support?

Login or Subscribe to submit a new ticket.

(If filing a bug or you have a pre-sales request, please contact us directly.)