Buy Now
Sign in

FAQ search

How to add custom CSS or JavaScript to form

Published: Saturday, 27 May 2017 09:39

You can customize the styling of your form elements by adding a Custom CSS element to your section, you can find the CSS element under the "Custom" group under "Designer".

Similary you can extend your form features by adding custom JavaScript code or function, the JavaScript element is available under the "Custom" group under the "Designer" section.

To load a JavaScript file you can use one of these methods:

a. Use a Custom Code action in the Setup tab using PHP like this:

$jdoc = \JFactory::getDocument();

b. Use a JavaScript element in the Designer tab with JavaScript like the example below and the 'Add inside domready event' option checked. This method uses an Ajax call to find and load the file after the page has loaded:

$.getScript('path_to_file/file_name', function(){
  // code to run when the file is loaded