Joomla 4 n’intègre plus par défaut jquery. La façon d’intégrer un fichier externe js ou css a également changé. Voici comment procéder:
dans le fichier montemplate/joomla.asset.json
ajoutez chaque fichier dans l’objet json comme par exemple
{
“name”: “template.nomduscript”,
“description”: “Add the gsap library”,
“type”: “script”,
“uri”: “gsap-public/minified/gsap.min.js”,
“dependencies”: [
“template.active” (si ce fichier est dépendant d’un autre spécifiez-le ici)
]
},
si un fichier doit être chargé après un autre, spécifié ce dernier dans dans “dependencies”
Petite exception pour charger jQuery qui fait encore partie de Joomla mais n’est plus chargé d’office, vous pouvez simplement ajouter cette ligne dans la surcharge que vous aurez créé
\Joomla\CMS\HTML\HTMLHelper::_(‘jquery.framework’);
Joomla 4 est livré avec la librairie Bootstrap 5. On pourra intégrer séparément chaque composant Javascript de la manière suivante en indiquant dans le premier paramètre le type de composant et dans le deuxième un sélecteur.
\Joomla\CMS\HTML\HTMLHelper::_(‘bootstrap.alert’, ‘.alert’);
Les options peuvent être configurées avec le troisième paramètre optionnel (un tableau):
\Joomla\CMS\HTML\HTMLHelper::_(‘bootstrap.carousel’, ‘.carousel’, [‘slide’=>’carousel’]);
ensuite dans montemplate/index.php, appeler le “name” du fichier comme ce qui suit
$wa->usePreset(‘template.cassiopeia.’ . ($this->direction === ‘rtl’ ? ‘rtl’ : ‘ltr’))
->useStyle(‘template.active.language’)
->useStyle(‘template.user’)
->useScript(‘template.user’)
->useScript(‘template.nomduscript’)
->addInlineStyle(‘:root {
–hue: 214;
–template-bg-light: #f0f4fb;
–template-text-dark: #495057;
–template-text-light: #ffffff;
–template-link-color: #2a69b8;
–template-special-color: #001B4C;
}’);