Suivez les campagnes avec Metricalp

Il ne fait aucun doute que nous construisons d'excellents produits pour nos clients. Ensuite, nous devons les atteindre et montrer notre excellent produit. Nous utilisons des campagnes pour cela. Nous utilisons différents canaux tels que Google, Facebook, Instagram, X (Twitter), LinkedIn, etc. Nous utilisons différents types de campagnes comme la recherche, l'affichage, la vidéo, les achats, l'installation d'applications, l'engagement des applications, la génération de leads, les annonces dynamiques, les annonces carrousel, etc. Nous voulons atteindre le plus grand nombre possible de clients potentiels avec nos campagnes. Pour ce faire, nous devons toujours optimiser et améliorer nos campagnes. Nous devons les suivre, les analyser et prendre des mesures basées sur notre analyse. Mais comment pouvons-nous faire cela ? Whoop whoop, oui, Metricalp est la réponse.

Il existe certains paramètres standard de l'industrie pour les campagnes. Ceux-ci sont appelés paramètres UTM. Les paramètres UTM sont utilisés pour suivre l'efficacité des campagnes marketing à travers les sources de trafic et les médias de publication. Ils sont ajoutés à la fin des URL et sont lus par des outils d'analyse comme Metricalp. Les cinq paramètres UTM standard sont :

• utm_source : La source du trafic, telle que Google, Facebook ou newsletter.
• utm_medium : Le moyen du trafic, tel que social, email ou CPC.
• utm_campaign : Le nom de la campagne, tel que summer_sale ou new_product_launch.
• utm_term : Le mot-clé du trafic, tel que running+shoes ou email+marketing.
• utm_content : Le contenu du trafic, tel que ad_variant_a ou email_variation_1.

Nous avons conçu Metricalp pour fonctionner avec ces paramètres UTM. Lorsqu'un client visite votre site web avec l'un de ces paramètres, il sera automatiquement attaché aux événements.

Mais vous pouvez également utiliser vos paramètres personnalisés pour suivre vos campagnes. Nous allons montrer ci-dessous la méthode standard de l'industrie et la méthode des paramètres personnalisés.

Bien, commençons par la méthode standard de l'industrie. Vous pouvez utiliser des paramètres UTM dans vos URL pour suivre vos campagnes. Croyez-le ou non, c'est tout ce que vous devez faire. Metricalp s'occupe du reste. Donc, lorsque vous avez un site web comme myawesomewebsite.com et que vous souhaitez suivre votre campagne, assurez-vous que votre campagne redirige vers votre site web avec des paramètres UTM. Par exemple, si vous avez une campagne appelée "summer_sale" et que vous utilisez Google Ads pour cela, vous pouvez utiliser une URL comme celle-ci :

https://myawesomewebsite.com/?utm_source=google&utm_medium=cpc&utm_campaign=summer_sale

Lorsqu'un client clique sur cette URL, Metricalp attachera automatiquement ces paramètres aux événements. Vous verrez ces paramètres dans votre tableau de bord sur la carte Sources. Regardez l'image de couverture de ce post comme exemple. C'est directement de Metricalp, nous utilisons des paramètres UTM dans nos campagnes. Actuellement, nous avons de nombreuses campagnes sur X (Twitter) et quelques campagnes Google Ads. Notre convention de nommage des campagnes est comme "x" (signifie Twitter) "ma" (signifie Metricalp) et le numéro de l'annonce de la campagne, donc c'est comme "xma12". Si vous vérifiez l'image de couverture, vous pouvez voir que nous avons produit de nombreuses visites à travers la campagne xma5. Maintenant, nous essayons d'optimiser nos autres campagnes en nous basant sur les aspects de cette campagne xma5. C'est un cas très simple dans lequel nous utilisons Metricalp pour Metricalp.

Il y a un détail à ce point (comme toujours). Si votre site web est un système basé sur JavaScript comme React, NextJS, Angular, Nuxt, etc., le script Metricalp sera chargé une seule fois. Ainsi, les paramètres UTM seront lus depuis l'URL par Metricalp et attachés à tous les événements produits. Par exemple, les premiers événements screen_view, les événements screen_view suivants (navigation) et l'événement click_buy. Mais si vous utilisez un site côté serveur ou statique comme Wordpress, PHP, HTML pur, etc., le script Metricalp sera chargé encore et encore à chaque routage (navigation). Donc, dans le premier événement screen_view, les paramètres UTM seront attachés à l'événement, mais lorsque l'utilisateur navigue vers une autre page et si vous ne joignez pas les mêmes paramètres UTM à toutes les nouvelles URL, vous perdrez les paramètres UTM. Donc, vous ne les aurez pas pour les événements click_buy, par exemple. Mais, ce serait génial, non ? Nous savons quelle campagne apporte combien de clients, mais ce serait encore mieux si nous savions quelle campagne a causé le plus d'événements click_buy (ventes). C'est fondamentalement du marketing 😎 Voyons comment nous pouvons réaliser cela pour les systèmes côté serveur/statique.

Nous allons tirer parti d'un vieil ami "sessionStorage". Nous garderons les paramètres UTM à l'intérieur du sessionStorage, qui est une API de stockage de données disponible dans le navigateur. Il est similaire à localStorage, mais les données stockées dans sessionStorage sont supprimées lorsque la session de la page se termine. Une session de page dure tant que le navigateur est ouvert et survit aux rechargements de page et aux restaurations. Nous pouvons donc conserver les paramètres UTM dans le sessionStorage et les attacher aux événements. Voyons comment nous pouvons faire cela.

  
            <script>
              let utmCampaign = sessionStorage.getItem('utm_campaign');
              if (!utmCampaign) {
                const urlParams = new URLSearchParams(window.location.search);
                utmCampaign = urlParams.get('utm_campaign');
                if (utmCampaign) {
                  sessionStorage.setItem('utm_campaign', utmCampaign);
                }    
              }
            
              window.metricalp = window.metricalp || {
                queue: [],
                sharedCustomProps: {
                  _global: {
                    utm_campaign: utmCampaign ?? undefined
                  },
                },
                event: function (e) {
                    this.queue.push(e);
                },
              };
            </script>
            <script src="https://cdn.metricalp.com/event/metricalp.js" data-tid="YOUR_TID" async></script>
        

Maintenant, nous vérifions pour utm_campaign dans le sessionStorage, si cela n'existe pas là-bas, nous vérifions l'URL pour cela. S'il est présent dans l'URL, nous le conservons dans le sessionStorage. Ensuite, nous le passons globalement pour tous les événements. C'est mieux que de passer les mêmes paramètres UTM à toutes les URL. Cela ne dérangera pas vos URL. Vous pouvez utiliser cette approche pour différents paramètres (autres paramètres UTM et/ou paramètres personnalisés) et scénarios.

Appliquons-le aux paramètres URL personnalisés. Dans ce cas, nos frameworks basés sur JS doivent également analyser nos paramètres d'URL. Supposons que nous avons un paramètre URL personnalisé nommé "very_custom_param" et que nous voulons l'attacher à tous les événements.

  
            <script>
              let veryCustomParam = sessionStorage.getItem('very_custom_param');
              if (!veryCustomParam) {
                const urlParams = new URLSearchParams(window.location.search);
                veryCustomParam = urlParams.get('very_custom_param');
                if (veryCustomParam) {
                  sessionStorage.setItem('very_custom_param', veryCustomParam);
                }
              }
            
              window.metricalp = window.metricalp || {
                queue: [],
                sharedCustomProps: {
                  _global: {
                    custom_prop4: veryCustomParam ?? undefined
                  },
                },
                event: function (e) {
                    this.queue.push(e);
                },
              };
            </script>
            <script src="https://cdn.metricalp.com/event/metricalp.js" data-tid="mam48" async></script>
        

Très similaire au fragment de code précédent. Mais cette fois, nous avons passé notre paramètre personnalisé en tant que propriétés personnalisées (nous avons préféré custom_prop4). Simple comme ça. Maintenant, pour les événements screen_view ou click_buy ou tout autre événement, vous aurez ce paramètre personnalisé.

Nous avons utilisé custom_prop4 ci-dessus, mais vous pouvez toujours définir des alias de prop personnalisés pour avoir des props plus lisibles dans Metricalp. Consultez la documentation sur les événements et propriétés personnalisés pour plus de détails.

C'est tout. Nous avons appris comment capturer les paramètres d'URL et les utiliser comme props avec vos événements. Nous avons également appris que Metricalp fait cela automatiquement dans la plupart des scénarios pour les normes de l'industrie telles que les paramètres UTM. Mais nous avons montré comment étendre cela pour les systèmes statiques / côté serveur. Nous espérons que vous aurez de meilleures perspectives avec cette approche. Si vous avez des questions ou avez besoin d'aide, vous pouvez toujours nous contacter via la page de contact.