CSS and JavaScript assets

This article is machine translated.

Often additional assets such as CSS or JavaScript files are required for an individual template. These files can always be integrated via the page layout of a theme. However, the assets are always loaded, even if they are not needed on different pages. It is therefore useful to specify these files in the template itself. There are several options available.

The easiest way is to filescreate the files in a public directory below and then to reference them in the template:

<link href="files/myfolder/custom.css" rel="stylesheet">
<script src="files/myfolder/custom.js"></script>

Alternatively, you can also store the assets in the template so that they are displayed in the HTML header or footer of the page, for example:

$GLOBALS['TL_CSS'][] = 'files/myfolder/custom.css|static';
$GLOBALS['TL_JAVASCRIPT'][] = 'files/myfolder/custom.js|static';

This conversion offers further options. By specifying , for example, the files can staticbe added to the existing asset page layouts or combined. A detailed description of all options can be found in the developer documentation under Adding CSS & JavaScript Assets.