Shopify retire les script tags : les apps les perdent le 1er octobre, les boutiques le 1er mars

Le 1er mars 2027, une boutique se charge et la bulle de chat en direct n'est plus là. Le pop-up qui collectait les e-mails a disparu. Le guide des tailles sur la page produit manque. Rien dans l'admin n'explique pourquoi.

La raison se trouve dans une entrée du changelog du 24 août, adressée aux développeurs. Shopify retire les script tags du storefront et a fixé des échéances fermes.

Deux dates, et laquelle vous concerne

Une balise script (script tag) permet à une app de charger son JavaScript sur chaque page du storefront sans toucher au code du thème. Shopify a livré le remplaçant en 2021, les theme app extensions avec app embed blocks, et vient de fixer les dates finales.

Cette dépréciation ne concerne que le storefront. Les script tags n'ont jamais fonctionné dans le checkout.

La requête scriptTags et la mutation scriptTagDelete continuent de fonctionner après le 1er octobre. Les audits et les workflows de nettoyage resteront opérationnels.

Ce qui casse, et l'interrupteur que seul le marchand peut actionner

Les catégories d'apps qui utilisaient traditionnellement des script tags : chat en direct, pop-ups et capture d'e-mails, étoiles d'avis et badges de confiance, sélecteurs de devise, enregistrement de session et heatmaps, et anciens pixels de suivi. Beaucoup de ces apps ont été installées il y a des années et oubliées. Shopify n'a publié aucune liste des apps concernées. L'entreprise ne donne pas non plus le nombre de marchands qui les utilisent.

Le piège tient au fonctionnement du remplaçant. Pour les fonctionnalités visibles, le remplaçant est un app embed block dans une theme app extension. Les app embed blocks restent inactifs tant que le marchand ne les active pas dans l'éditeur de thème. L'app ne peut pas les activer à sa place.

Ils sont activés thème par thème : publier un nouveau thème désactive donc l'embed à nouveau. Publier un thème Black Friday en est un exemple courant. Conséquence : le développeur livre une mise à jour, envoie un e-mail, et tant que quelqu'un dans la boutique n'ouvre pas Boutique en ligne, puis Thèmes, ne clique pas sur Personnaliser, ne sélectionne pas App embeds et n'actionne pas l'interrupteur, la fonctionnalité tourne encore sur l'ancien script tag ou ne tourne pas du tout. Le marchand doit répéter cette étape à chaque changement de thème. Après le 1er mars, tout s'arrête.

Un autre risque concret vient de la documentation de Shopify elle-même. Tant qu'un script tag et son embed tournent en même temps, le script se charge deux fois. Les analytics comptent en double, et l'interface s'affiche deux fois. L'ordre est strict : livrer l'embed, vérifier qu'il est actif sur le thème publié, puis supprimer le tag. Ne jamais supprimer en premier.

L'audit en cinq minutes pour les marchands

Aucun rapport n'existe dans l'admin pour cette migration. La bannière n'apparaît qu'au moment de l'installation, donc les marchands existants ne voient rien dans leur tableau de bord. Le code source de la page montre tout.

Ouvrez la page d'accueil de la boutique dans un navigateur de bureau. Affichez le code source avec le raccourci clavier habituel (Ctrl+U ou Cmd+Option+U). Cherchez asyncLoad dans le texte.

Chaque URL en dessous qui se termine par ?shop=votreboutique.myshopify.com est un script tag. Le domaine indique généralement le nom de l'app. Croisez ensuite avec Boutique en ligne, Thèmes, Personnaliser, App embeds. Une app présente aux deux endroits est en cours de migration.

Une app présente dans le code source mais absente des App embeds est celle à qui écrire. La question à poser, mot pour mot : « Votre app utilise-t-elle encore des script tags sur le storefront, et quand le remplaçant en app embed sera-t-il livré ? » Les équipes support des apps actives sauront exactement de quoi il s'agit.

Le conseil de calendrier pour les marchands est simple. Auditez en septembre. Ne touchez pas à votre pile d'apps de la mi-octobre à décembre, en pleine haute saison. Activez les embeds et retirez les apps dont les éditeurs n'ont jamais répondu en janvier et février.

Un effet secondaire mérite d'être mentionné une fois. Les script tags se chargent sur chaque page, qu'ils soient utiles ou non. Les navigateurs téléchargent donc du code inutile. Les embeds peuvent être limités à des templates précis, par exemple charger le guide des tailles uniquement sur les pages produit. Le tri rend en général la boutique plus rapide.

Si l'app est la vôtre, livrez l'embed avant le 1er octobre

Pour les éditeurs d'apps, le 1er octobre compte plus que le 1er mars à cause des nouvelles installations. Passé cette date, une installation fraîche ne peut plus créer de script tag, donc l'app est cassée pour chaque nouveau client. La boutique affichera aussi une bannière d'avertissement à l'installation si vous ne livrez ni embed ni web pixel.

L'ordre de migration dans la documentation Shopify est clair. Premièrement, construire la theme app extension avec un app embed block. Deuxièmement, envoyer le marchand par lien profond dans l'éditeur de thème avec l'embed préactivé. Troisièmement, vérifier que l'embed est actif sur le thème publié. Quatrièmement, supprimer le script tag avec scriptTagDelete.

Voici la requête d'audit que nous lançons en premier. Elle renvoie les URL sources exactes et les dates de création.

query {
  scriptTags(first: 50) {
    nodes { id src displayScope createdAt }
  }
}

Nous construisons des apps Shopify et des Shop Minis. Notre équipe a livré une suite de quatre Shop Minis pour un client, et deux d'entre eux ont atteint le Top 5 de leur catégorie. Nous avons déjà migré des apps à script tags vers des theme app extensions.

Le schéma que nous observons est constant. Le bloc embed lui-même représente un ou deux jours de travail. Les semaines partent dans les nouveaux tests sur le thème réel du marchand, parce que le script supposait des sélecteurs DOM que le thème n'a pas, et dans la relance des marchands pour qu'ils actionnent l'interrupteur.

Si le script ne fait qu'envoyer des événements, prenez la voie du web pixel, même si cela implique d'abandonner une fonctionnalité, parce qu'elle ne demande rien au marchand.

Chaque lecteur a une prochaine étape concrète. Marchands : faites la vérification du code source dès aujourd'hui. Éditeurs d'apps : lancez la requête scriptTags sur l'ensemble de vos installations et comptez-les.