Articles

Loaded modules (plug-ins) can use additional stylesheets and script files. There are several ways to load such files in ALite CMS.

• These files should be selected in the system setting in the field 'Additional Styles' or 'Additional Metatags'.
  For example:
  < link rel="stylesheet" type="text/css" href=" /_themes/theme_name/plugins/css/my_style.css" / >
  < !--[if IE 6] >< link rel="stylesheet" type="text/css" href=" /_themes/theme_name/css/my_style_ie6.css" / >< ![endif]-- >
  < script type="text/javascript" src="=" /_themes/theme_name/plugins/js/stat.js" >< / script >
  < script type="text/javascript" src="=" /_js/stat.js" >< / script >
  In the described way, the files are automatically inserted in the tag, loaded, when the page is opened, are always available and do not require any special calls or processing.
• Load of additional files inside the enabled modules. In this case, additional files are loaded only during processing of the enabled module. If additional files are to be used in the exact enabled module or in dependent modules, it is desirable to use this very way. It reduces the data size transferred to the client and speeds up the page load as a result. This case is described below.

Direct code insert in plug-in text with usage of < link... or < style type="text/css" >... tags is processed with the most browsers, but is incorrect. Styles should be loaded inside the < head > tag. It's more correct to load script files in the < head >tag, but not to insert pieces of code in the plug-in content.

To load stylesheets and script files, ALite CMS offers a JavaScript function loadExternalJsCssFile(fileName, fileType). The function has two parameters:
fileName - path and file name on the server;
fileType - type of the uploaded file (it can have a value 'css' for stylesheets or 'js' for JavaScript files). This function loads the indicated files and doesn't let to upload duplicates.

For example:
aliteLoadExternalJsCssFile('/_themes/theme_name/plugins/css/my_style.css', 'css');
aliteLoadExternalJsCssFile('/_themes/theme_name/plugins/js/my_script.js', 'js');

Usage of this function has a special feature. It doesn't permit to upload files in the page builder. To prevent that, a php function load_external_js_css_file($file_name, $file_type) can be used to adjust loading of stylesheets and script files considering specifics of work in the page builder. Call for and parameters of this function are similar to the ones of the loadExternalJsCssFile function.
It's always better to use the php function load_external_js_css_file to load the files, but not to call the JavaScript function loadExternalJsCssFile directly.

For example:
echo load_external_js_css_file('/_themes/'.alite_get_user_theme().'/plugins/css/my_style.css', 'css');
echo load_external_js_css_file('/_themes/'.alite_get_user_theme().'/plugins/js/my_script.js', 'js');

Annotation:
Javascript processing is limited in the page builder and the most script functions don't work.