Pour un site j’ai dû mettre un code de tracking sur chaque élément d’un formulaire.
Pourquoi ne pas l’avoir fait avec onclick="ga('send', 'event', 'Budget', 'Select', 'De 200 000 à 250 000 €');"
me direz-vous ? Eh ben parce que mon client à voulu des select customisés et du coup le code de tracking ne fonctionnais plus…
Du coup j’ai trouvé cette astuce :
Si vous utiliser l’ancienne version de Google Analytics
Dans le header
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-VOTRE COMPTE-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script');
ga.type = 'text/javascript';
ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);
})();
Dans la page de résultat
_gaq.push(
['_trackEvent', 'Location', 'Select', ''],
['_trackEvent', 'Rayon', 'Select', ''],
['_trackEvent', 'Budget', 'Select', ''],
['_trackEvent', 'Surface terrain', 'Select', ''],
['_trackEvent', 'Recherche', 'CTA', 'Rechercher']
);
Si vous utiliser la nouvelle version (Universal Analytics)
Dans le header
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;
i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();
a=s.createElement(o), m=s.getElementsByTagName(o)[0];
a.async=1;a.src=g;
m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-VOTRE_CODE-1', 'VOTRE_SITE'); ga('send', 'pageview');
Dans la page de résultat
ga('send', 'event', {'eventCategory':'Location', 'eventAction':'Select', 'eventLabel':''});
ga('send', 'event', {'eventCategory':'Rayon', 'eventAction':'Select', 'eventLabel':''});
ga('send', 'event', {'eventCategory':'Budget', 'eventAction':'Select', 'eventLabel':''});
ga('send', 'event', {'eventCategory':'Surface terrain', 'eventAction':'Select', 'eventLabel':''});
ga('send', 'event', {'eventCategory':'Recherche', 'eventAction':'CTA', 'eventLabel':'Rechercher'});
Et voilà, le tour est joué !
Pour un projet de boutique en ligne, j’ai dû ajouter un champ supplémentaire non prévu nativement à la fiche produit d’une boutique Prestashop comme les points fort. Fort heureusement Prestashop permet « assez » facilement d’intégrer ces champs de type TEXT ou TEXTAREA de façon plutôt propre.
I – Ajouter le champ dans la base de données
Baladez-vous dans votre base de données via phpMyAdmin par exemple et ajouter une colonne « pointsforts » de type TEXT dans la table PREFIX_product_lang (Par défaut PREFIX est ps_)
II – Modification de la classe Product
Versions 1.5.3.x : Rendez-vous dans override/classes/Product.php
. Ajoutez-y les lignes suivantes :
self::TYPE_HTML, 'lang' => true, 'validate' => 'isString');
parent::__construct($id_product, $full, $id_lang, $id_shop, $context);
}
Versions 1.5.4+ : Si vous avez une version de Prestashop supérieure ou égale à celle-ci, vous devez créer le fichier d’override « Product.php » dans override/classes/
. Son contenu doit ressembler à cela dans le cas présent :
self::TYPE_HTML, 'lang' => true, 'validate' => 'isString');
parent::__construct($id_product, $full, $id_lang, $id_shop, $context);
}
}
Attention de ne pas oublier de supprimer le fichier cache/class_index.php
afin que la surcharge soit bien prise en compte. Ne vous inquiétez pas, le fichier se régénérera tout seul.
III – Modifier la vue backoffice
Rendez-vous dans admin/themes/default/template/controllers/products/informations.tpl
et copiez ce fichier.
Collez-le ensuite dans override/controllers/admin/templates/products/informations.tpl
En s’inspirant de la ligne 290, collez le code suivant, qui va créer le champ texte :
Versions 1.5.x :
{include file="controllers/products/multishop/checkbox.tpl" field="pointsforts" type="tinymce" multilang="true"}<label>{$bullet_common_field} {l s='Points forts :'}<br /></label>
<p class="product_description">({l s='Les points forts du produit'})</p>
{include file="controllers/products/textarea_lang.tpl" languages=$languages input_name='pointsforts' input_value=$product->pointsforts}
<p class="clear"> </p>
Versions 1.6.x :
{include file="controllers/products/multishop/checkbox.tpl" field="pointsforts" type="tinymce" multilang="true"}
<label>{$bullet_common_field} {l s='Points forts :'}<br /></label>
<p class="product_description">({l s='Les points forts du produit'})</p>
{include file="controllers/products/textarea_lang.tpl" languages=$languages input_name='pointsforts' class="autoload_rte" input_value=$product->pointsforts}
<p class="clear"> </p>
IV – Affichage en front-office
Il ne vous reste plus qu’à afficher ce champ en front-office. Pour ce faire, modifiez le fichier themes/votre_theme/product.tpl
et ajoutez ce qui suit à l’endroit que vous souhaitez :
{$product->pointsforts}
Si vous souhaitez afficher la valeur de votre nouveau champ sur la page des catégories, rendez-vous dans classes/Category.php
et copiez la fonction getProducts() (ligne 555 approximativement).
Collez cette fonction dans le fichier override/classes/Category.php
(à créer s’il n’existe pas), et modifiez-y la requête ($sql) , en rajoutant pl.pointsforts dans le SELECT.
V – Supprimer le TinyMCE (Prestashop 1.6)
Il est tout à fait possible d’enlever l’éditeur de texte TinyMCE. La démarche est on-ne-peut-plus simple avec Prestashop 1.6. En effet, l’éditeur ne s’applique que sur les textareas possédant une classe nommée « autoload_rte ». En enlevant-celle-ci, le script ne s’applique plus et vous avez un textarea tout à fait normal.
Dans Prestashop 1.6, il vous suffit donc du supprimer autoload_rte de l’argument « class » passé dans le include à la fin. Si vous avez une version antérieure de Prestashop (1.5 par exemple), la classe n’est pas passée en argument. donc il va falloir retrouver le fichier inclus, copier/remplacer son contenu dans le fichier admin/themes/default/template/controllers/products/informations.tpl
et enlever « autoreload_rte ».
VI – Un problème ?
En cas de problème, vérifiez que la compilation est bien désactivée.
Pour cela, rendez-vous dans Paramètres avancés > Performances et modifiez les options suivantes :
- Cache des templates : Forcer la compilation à chaque appel
- Cache : Non (X)
Pour les versions 1.5.6, cliquez aussi sur le bouton « Effacer le cache de Smarty et le cache de l’Autoload ».
Une fois cela fait, réessayez. Cela devra fonctionner.
Si tout est bon, pensez cependant à re-modifier ces informations et de les remettre sur :
- Cache des templates : Ne jamais recompiler les fichiers de templates
- Cache : Oui
Sans quoi, votre site va se mettre à ramer horriblement.
Et voilà le tour est joué.