# Bloc Javascript

## Ajout de code JavaScript statique

Commanders Act vous permet d’inclure du JavaScript « gratuit » dans le container de tag, sans limite de caractères, à deux endroits nommés « Static JavaScript Code ».

Les « Static JS codes » vous permettent d’effectuer différents types d’actions, notamment :

– Corriger les problèmes de data layer.

Par ex. si votre variable externe « page\_name » contient des valeurs avec des caractères spéciaux, vous pouvez les supprimer ou les remplacer dans le code Static JavaScript (par exemple, remplacer « & » par « and » comme suit :

<figure><img src="https://3282103337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Mk6XpTQ2LaRLcr2tA-d%2Fuploads%2Fgit-blob-fa8403aad45d68f183fbc99bd2925a30d3f2e094%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

Ainsi, vous pouvez continuer à utiliser votre variable externe « page\_name » dans les tag en supprimant ses caractères spéciaux via le code Static JS.

– Récupérer des données absentes du data layer à partir du code source des pages du site.

Par ex. vous pouvez récupérer des champs de formulaire JQuery dans votre bloc Static JS de la manière suivante :

<figure><img src="https://3282103337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Mk6XpTQ2LaRLcr2tA-d%2Fuploads%2Fgit-blob-bde3c11c0fb0d930a6149d79f745b3455bdeff7c%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

Les « Static JS codes » apparaissent à deux endroits dans le menu de gauche de l’interface de l’étape « EDIT » :

– Le premier code Static JS est placé avant la déclaration des variables internes, dans l’ordre d’exécution des éléments de votre container de site.

– Le second code Static JS est placé après la déclaration des variables internes (vous pouvez ainsi réutiliser à cet endroit les variables internes déjà déclarées) :

<figure><img src="https://3282103337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Mk6XpTQ2LaRLcr2tA-d%2Fuploads%2Fgit-blob-3cd520453bcf1bae51bee071baf16040e9ae4cf2%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

La même interface utilisateur est utilisée pour le code Static JavaScript, qu’il s’exécute avant ou après les variables internes. Il vous suffit de saisir le code JavaScript souhaité et de cliquer sur « SAVE ».

## Ajout de fichiers JavaScript dynamiques

Commanders Act permet **dynamic** **JavaScript** fichier(s) d’être inclus dans un container de tag, à deux endroits nommés « **Dynamic** **JavaScript** **File(s)** ».

Contrairement aux « **Static** **JavaScript** **codes** », les « **Dynamic** **JavaScript Files** » sont des fichiers JavaScript **externes** à Commanders Act qui sont **téléchargés** puis **ajoutés** ou mis à jour dans le container à chaque génération.

Les « **Dynamic JavaScript File(s)** » vous permettent d’effectuer différents types d’actions.

Par exemple, vous pouvez les utiliser pour importer dans votre container un fichier JavaScript contenant une **JQuery** bibliothèque (si elle n’est pas déjà appelée sur votre site) ou un fichier convertisseur de devises JavaScript. En important ces fichiers dans Commanders Act, vous pouvez les ajouter à vos solutions ou les utiliser pour créer de nouvelles variables (par exemple, vous pouvez mettre automatiquement à jour les devises dans les tag de vos solutions).

Les « Dynamic JavaScript File(s) » apparaissent à deux endroits dans le menu de gauche de l’étape « **EDIT** » :

* Le **d’abord** Dynamic JavaScript File(s) est placé avant la déclaration des variables internes, dans l’ordre d’exécution des éléments du container sur votre site.
* Le **second** Dynamic JavaScript File(s) est placé après la déclaration des variables internes (vous pouvez ainsi réutiliser à cet endroit les variables internes déjà déclarées) :

  <figure><img src="https://3282103337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Mk6XpTQ2LaRLcr2tA-d%2Fuploads%2Fgit-blob-84380810675e9131731f9840a1bd137b19e4545d%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

La même interface utilisateur est utilisée pour les Dynamic JavaScript File(s), qu’ils s’exécutent avant ou après les variables internes. Il vous suffit de saisir l’URL de votre fichier JavaScript et de cliquer sur « **SAVE** ».

Vous pouvez répéter cette opération pour tous les fichiers JavaScript à inclure dans votre container de tag.

Attention : l’ajout de fichiers JavaScript au container va **augmenter** sa taille et donc augmenter le temps de chargement des pages.

Vous pouvez mettre à jour votre fichier dynamique **manuellement** (en cliquant sur « Refresh »), afficher son contenu (« View ») ou le supprimer (« Remove ») :\\

<figure><img src="https://3282103337-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Mk6XpTQ2LaRLcr2tA-d%2Fuploads%2Fgit-blob-93ab7483abdd323a9ef1ea679bb0cc71c40762eb%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>
