# Où s’intercale le rendu d’un widget Elementor entre wp_head et wp_footer

> Comprendre à quel moment précis du cycle de chargement WordPress un widget Elementor s'exécute évite bien des scripts injectés au mauvais endroit.

- Auteur : WordPress Développement
- Publié le : 2020-08-10
- Mis à jour le : 2020-08-10
- Catégorie : Elementor
- URL : https://www.wpmoderne.fr/elementor/rendu-widget-elementor-wp-head-wp-footer/

## L’essentiel

- Le rendu du widget a lieu pendant the_content, pas à un hook dédié
- wp_head est déjà fermé quand le contenu s'affiche
- wp_footer reste l'endroit fiable pour un script différé

La documentation officielle sur la [référence de wp_head()](https://developer.wordpress.org/reference/functions/wp_head/) précise que ce hook s'exécute avant la fermeture de la balise `</head>`, une fois pour toute la page. Cette précision, en apparence anodine, prend tout son sens quand on cherche à comprendre pourquoi un script inséré depuis un widget Elementor personnalisé n'apparaît jamais dans le `<head>` du document, quoi qu'on tente.

Situer précisément le moment où un widget Elementor produit son HTML dans le cycle de chargement de WordPress évite des heures de recherche inutile lorsqu'un script doit s'exécuter à un endroit précis de la page.

## Le cycle de chargement, étape par étape

Une requête WordPress classique traverse plusieurs grandes étapes avant de produire une page complète : le chargement du cœur et des plugins, la résolution de la requête via `WP_Query`, puis le chargement du template correspondant. C'est ce template — `page.php`, `single.php` ou un template personnalisé selon le thème — qui appelle successivement `wp_head()`, la boucle principale via `the_content()`, puis `wp_footer()`.

```
<?php get_header(); // déclenche wp_head() ?>

<?php while ( have_posts() ) : the_post(); ?>
    <?php the_content(); // rendu Elementor a lieu ici ?>
<?php endwhile; ?>

<?php get_footer(); // déclenche wp_footer() ?>
```

## Où se situe exactement Elementor dans ce cycle

> L'essentiel à retenir : Le rendu du widget a lieu pendant the_content, pas à un hook dédié ; wp_head est déjà fermé quand le contenu s'affiche ; wp_footer reste l'endroit fiable pour un script différé

Elementor ne remplace pas `the_content()` par un mécanisme séparé : il s'accroche au filtre `the_content` lui-même. Concrètement, quand une page est construite avec Elementor, le contenu retourné par ce filtre n'est plus le contenu brut de l'éditeur classique, mais le HTML généré à partir de la structure stockée dans `_elementor_data`. Ce remplacement se produit donc strictement au moment où le template appelle `the_content()`, c'est-à-dire après `wp_head()` et avant `wp_footer()`.

Cette place dans le cycle explique un comportement fréquemment mal compris : un script inséré directement dans un widget Elementor personnalisé, via `echo '<script>...</script>';` dans la méthode `render()` du widget, se retrouve physiquement au milieu du corps de la page, jamais dans le `<head>`, même si le script porte des instructions destinées à s'exécuter tôt.

## Les trois hooks à retenir pour placer un script correctement

- `wp_head` : pour tout ce qui doit être présent avant le rendu visuel, comme une balise meta ou une feuille de style critique.
- Le rendu du widget lui-même, via `the_content` : pour le HTML visible propre au widget, jamais pour un script global.
- `wp_footer` : pour tout script qui peut s'exécuter après l'affichage complet, ce qui couvre la grande majorité des cas de scripts tiers.

Pour qu'un widget personnalisé injecte un script global de façon propre, la bonne pratique consiste à accrocher ce script sur `wp_footer` depuis la méthode `render()` du widget, plutôt que de l'écrire en ligne dans le HTML produit :

```
protected function render() {
    add_action( 'wp_footer', function() {
        echo '<script>console.log("widget chargé");</script>';
    } );
    echo '<div class="mon-widget">Contenu</div>';
}
```

## Un cas concret : une balise de suivi mal placée

Sur un projet où un widget d'inscription à une newsletter embarquait un script de suivi tiers écrit directement dans son HTML, ce script se retrouvait dupliqué autant de fois que le widget était utilisé sur la page, chaque instance rechargeant sa propre copie du script. Le déplacement de ce script vers `wp_footer`, avec une vérification qu'il ne s'exécute qu'une seule fois via un indicateur statique, a résolu le problème sans toucher au fonctionnement visuel du widget.

> Un script qui doit s'exécuter une seule fois par page ne doit jamais vivre dans la méthode de rendu d'un widget répétable.

## En résumé

Situer un widget Elementor entre `wp_head()` et `wp_footer()` dans le cycle de chargement de WordPress, precisément au niveau du filtre `the_content`, permet de choisir le bon hook pour chaque script plutôt que de deviner. Les hooks propres à Elementor, comme ceux qui interviennent pendant l'édition ou l'enregistrement des widgets, répondent à une logique différente et méritent un article à part entière.
