Il existe plusieurs façons d'inclure votre code Javascript personnalisé dans Joomla. Dans ce tutoriel, nous allons vous expliquer comment les utiliser et quel est le meilleur en fonction du code que vous souhaitez inclure.
Par le gestionnaire de Template
L'administration du template YJSG est fournie avec un onglet Code personnalisé que vous pouvez utiliser pour ajouter vos extraits JavaScript personnalisés dans l'entête ou le pied de page du template.
En utilisant JDocument
En joomla vous pouvez utiliser la classe JDocument pour ajouter des fichiers Javascript personnalisés ou un bloc de code Javascript dans la section head de votre template.
Ce premier exemple montre comment ajouter un fichier Javascript personnalisé dans un template basé sur YJSG.
Pour votre commodité, vous pouvez utiliser le nom de fichier yjsg_custom_params.php pour ajouter des fichiers personnalisés ou des blocs de code.
Ce fichier est situé dans le dossier racine/template/yjsg_template_name/custom/ .
Ajouter un fichier Javascript personnalisé via JDocument / addScript
Commencez par déplacer votre fichier Javascript dans le dossier racine/template/yjsg_template_name/src/ , ouvrez yjsg_custom_params.php et ajoutez cette ligne:
exemple:
$document->addScript($yj_site.'src/my_new_js_file.js');
Ajout de fichier personnalisé via l'array $YjsgCustomJS
Cette option est spécifique aux tempaltes basés uniquement sur YJSG et est utilisée pour charger votre fichier Javascript après que tous les scripts du template et les fichiers de la bibliothèque Javascript Joomla aient été chargés.
Pour utiliser $YjsgCustomJS déplacez d'abord votre fichier JavaScript vers le dossier racine/template/yjsg_template_name/src/ , ouvrez yjsg_custom_params.php et ajouter cette ligne:
exemple:
$YjsgCustomJS= array();
$YjsgCustomJS[] = $yj_site.'src/my_new_js_file.js';
Pour ajouter plusieurs fichiers, ajoutez cette ligne dans yjsg_custom_params.php
exemple:
$YjsgCustomJS= array();
$YjsgCustomJS[] = $yj_site.'src/my_new_js_file.js';
$YjsgCustomJS[] = $yj_site.'src/my_new_js_file2.js';
Ajout d'un bloc JavaScript dans le head avec JDocument/addScriptDeclaration
Pour ajouter un bloc de code JavaScript, ouvrez yjsg_custom_params.php et ajouter cette ligne
exemple:
$document->addScriptDeclaration("var myVar = 'myValue';");
Adding block of Javascript in head with $yjsg_js variable
Un des avantages de l'utilisation de la variable $yjsg_js est que cela charge votre code de bloc Javascript en bas de votre page au lieu de dans le head.
De cette façon, les blocs de code n'encombrent pas le chargement de votre page et c'est beaucoup mieux pour votre SEO du site Web. Pour de meilleures performances et des balises d'entête plus propres $yjsg_js est répercuté à la fin de la page dans layouts/yjsg_footer.php. L'utilisation est très simple et est similaire à JDocument/addScriptDeclaration.
Ajoutez juste la ligne suivante au fichier yjsg_custom_params.php .
exemple:
$yjsg_js.="var myVar ='my_js_var;'";
Attention: ne pas oublier le point avant l'opérateur =.