[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"theme-db":3,"$fO-vGAJiFUEsHfhz3Gyq2d3rTAlnW2xA5E53rfwWR1QU":22,"footer-db":67,"$fKnz2vuX4bZz1LbUTiuFsvSZ3e07l5_5fqNYp4Tzdhi8":87,"header-db":167,"megamenu":178,"$fdpkr_rdvhZ0jUpBPjNQ8RemiuGpijPoOnZTgaCJRvN4":233},{"theme":4},{"colors":5,"typography":13,"ui":17,"defaultColorMode":21},{"primary":6,"secondary":7,"background":8,"foreground":9,"muted":10,"headerBg":11,"footerBg":12,"topBarBg":9,"topBarText":11},"#4F46E5","#0D9488","#F9FAFB","#111827","#6B7280","#ffffff","#020617",{"fontFamily":14,"fontUrl":15,"baseFontSize":16},"Inter, system-ui, sans-serif","https:\u002F\u002Ffonts.googleapis.com\u002Fcss2?family=Inter:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,700;0,800;0,900;1,400;1,700&display=swap","16px",{"borderRadius":18,"contentWidth":19,"shadow":20},"lg","7xl",true,"light",{"title":23,"slug":24,"metaDescription":25,"category":26,"tags":27,"difficulty":34,"psVersions":35,"content":39,"faq":40,"tldr":62,"readingTime":63,"generatedAt":64,"publishDate":64,"relatedArticles":65,"sourceCategory":66},"Intégrer du JavaScript dans une page produit PrestaShop","integrer-javascript-page-produit-prestashop","Comment ajouter du JavaScript personnalisé sur vos fiches produits PrestaShop 1.6, 1.7 et 8.x : hooks, modules, bonnes pratiques et pièges à éviter.","developpement",[28,29,30,31,32,33],"javascript","page-produit","smarty","hooks","tpl","personnalisation","intermediaire",[36,37,38],"1.6","1.7","8.x","\u003Ch2>Pourquoi intégrer du JavaScript sur une fiche produit ?\u003C\u002Fh2>\n\u003Cp>La personnalisation des fiches produits est un besoin récurrent en e-commerce. Qu'il s'agisse d'ajouter un système \"Voir plus \u002F Voir moins\" sur la description longue, d'intégrer un calculateur de prix dynamique ou d'afficher un carrousel personnalisé, le JavaScript reste l'outil incontournable pour enrichir l'expérience utilisateur.\u003C\u002Fp>\n\u003Cp>Le problème, c'est que PrestaShop utilise des moteurs de templates (Smarty en 1.6\u002F1.7, puis Twig dans certains contextes en 8.x) qui peuvent entrer en conflit avec la syntaxe JavaScript. Voici les méthodes fiables pour intégrer vos scripts sans casser votre boutique.\u003C\u002Fp>\n\u003Ch2>Méthode 1 : Injection directe dans le template (PrestaShop 1.6)\u003C\u002Fh2>\n\u003Cp>Sur PrestaShop 1.6, le moteur Smarty interprète les accolades \u003Ccode>{}\u003C\u002Fcode> comme des balises de template. Or, le JavaScript en est truffé. C'est la source d'erreur numéro un pour les développeurs qui débutent avec PrestaShop.\u003C\u002Fp>\n\u003Ch3>La balise `{literal}` : votre alliée\u003C\u002Fh3>\n\u003Cp>Pour indiquer à Smarty d'ignorer un bloc de code, encadrez-le avec \u003Ccode>{literal}\u003C\u002Fcode> et \u003Ccode>{\u002Fliteral}\u003C\u002Fcode> :\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-smarty\">\n{literal}\n<script type=\"text\u002Fjavascript\">\n    function toggleDescription() {\n        var desc = document.getElementById('full-description');\n        var btn = document.getElementById('toggle-btn');\n        if (desc.style.display === 'none') {\n            desc.style.display = 'block';\n            btn.textContent = 'Réduire';\n        } else {\n            desc.style.display = 'none';\n            btn.textContent = 'En savoir plus';\n        }\n    }\n<\u002Fscript>\n{\u002Fliteral}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch3>Où placer ce script ?\u003C\u002Fh3>\n\u003Cp>Deux options recommandées :\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Option A — Dans \u003Ccode>product.tpl\u003C\u002Fcode> (spécifique au produit) :\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>Placez le script en fin de fichier \u003Ccode>themes\u002Fvotre-theme\u002Fproduct.tpl\u003C\u002Fcode>. L'avantage : il ne se charge que sur les pages produits.\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Option B — Dans \u003Ccode>footer.tpl\u003C\u002Fcode> avec condition :\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>Si vous préférez centraliser vos scripts personnalisés, injectez-les dans \u003Ccode>footer.tpl\u003C\u002Fcode> juste avant la balise \u003Ccode>\u003C\u002Fbody>\u003C\u002Fcode>, avec une condition sur le type de page :\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-smarty\">\n{if $page_name == 'product'}\n{literal}\n<script type=\"text\u002Fjavascript\">\n    \u002F\u002F Votre code JavaScript ici\n<\u002Fscript>\n{\u002Fliteral}\n{\u002Fif}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Cette approche est plus propre car elle centralise les ajouts et évite de surcharger le template produit.\u003C\u002Fp>\n\u003Ch2>Méthode 2 : Le hook `displayFooterProduct` (PrestaShop 1.7 \u002F 8.x)\u003C\u002Fh2>\n\u003Cp>À partir de PrestaShop 1.7, la bonne pratique consiste à passer par un \u003Cstrong>module\u003C\u002Fstrong> qui s'accroche aux hooks du système. Cela évite de modifier directement les fichiers de thème, ce qui facilite les mises à jour.\u003C\u002Fp>\n\u003Ch3>Hooks pertinents pour les pages produits\u003C\u002Fh3>\n\u003Ctr>\u003Cth>Hook\u003C\u002Fth>\u003Cth>Position\u003C\u002Fth>\u003Cth>Usage recommandé\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>`displayFooterProduct`\u003C\u002Fth>\u003Cth>Bas de la fiche produit\u003C\u002Fth>\u003Cth>Scripts spécifiques au produit\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>`displayProductAdditionalInfo`\u003C\u002Fth>\u003Cth>Zone d'informations complémentaires\u003C\u002Fth>\u003Cth>Contenus dynamiques\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>`actionFrontControllerSetMedia`\u003C\u002Fth>\u003Cth>Chargement des assets\u003C\u002Fth>\u003Cth>Fichiers JS\u002FCSS externes\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>`displayAfterBodyOpeningTag`\u003C\u002Fth>\u003Cth>Après `\u003Cbody>`\u003C\u002Fth>\u003Cth>Scripts de tracking\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ch3>Exemple de module minimal\u003C\u002Fh3>\n\u003Cpre>\u003Ccode class=\"language-php\">\n<?php\n\u002F**\n * @author Alexandre Carette <contact@alexandrecarette.fr>\n * @copyright 2026 Alexandre Carette\n * @license Propriétaire et Confidentiel\n *\u002F\n\nif (!defined('_PS_VERSION_')) {\n    exit;\n}\n\nclass MyProductScripts extends Module\n{\n    public function __construct()\n    {\n        $this->name = 'myproductscripts';\n        $this->version = '1.0.0';\n        $this->author = 'Alexandre Carette';\n        $this->tab = 'front_office_features';\n        $this->need_instance = 0;\n        $this->ps_versions_compliancy = ['min' => '1.7.0.0', 'max' => '8.99.99'];\n\n        parent::__construct();\n\n        $this->displayName = $this->l('Scripts produit personnalisés');\n        $this->description = $this->l('Ajoute du JavaScript personnalisé aux fiches produits.');\n    }\n\n    public function install()\n    {\n        return parent::install()\n            && $this->registerHook('actionFrontControllerSetMedia');\n    }\n\n    public function hookActionFrontControllerSetMedia($params)\n    {\n        if ($this->context->controller instanceof ProductControllerCore\n            || $this->context->controller->php_self === 'product') {\n            $this->context->controller->registerJavascript(\n                'myproductscripts-custom',\n                'modules\u002F' . $this->name . '\u002Fviews\u002Fjs\u002Fproduct-custom.js',\n                [\n                    'position' => 'bottom',\n                    'priority' => 200,\n                ]\n            );\n        }\n    }\n}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Puis créez le fichier \u003Ccode>modules\u002Fmyproductscripts\u002Fviews\u002Fjs\u002Fproduct-custom.js\u003C\u002Fcode> avec votre logique JavaScript.\u003C\u002Fp>\n\u003Ch2>Méthode 3 : Via l'API `registerJavascript` (recommandé en 8.x)\u003C\u002Fh2>\n\u003Cp>PrestaShop 8.x conserve le système de hooks mais encourage fortement l'utilisation de \u003Ccode>registerJavascript\u003C\u002Fcode> et \u003Ccode>registerStylesheet\u003C\u002Fcode> pour gérer les assets. Cette API offre un contrôle précis sur le chargement :\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-php\">\n$this->context->controller->registerJavascript(\n    'identifiant-unique',\n    'modules\u002Fmonmodule\u002Fviews\u002Fjs\u002Fscript.js',\n    [\n        'position' => 'bottom',      \u002F\u002F 'head' ou 'bottom'\n        'priority' => 200,            \u002F\u002F Plus bas = chargé en premier\n        'inline' => false,            \u002F\u002F true pour du JS inline\n        'attributes' => 'defer',      \u002F\u002F defer, async, ou module\n    ]\n);\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch2>Le piège TinyMCE : quand le back-office mange votre JavaScript\u003C\u002Fh2>\n\u003Cp>Si vous tentez d'insérer du JavaScript directement dans le champ \u003Cstrong>description longue\u003C\u002Fstrong> d'un produit via le back-office, vous allez rencontrer un problème majeur : l'éditeur de texte riche TinyMCE \u003Cstrong>supprime automatiquement les balises \u003Ccode>\u003Cscript>\u003C\u002Fcode>\u003C\u002Fstrong> lors de la sauvegarde.\u003C\u002Fp>\n\u003Cp>C'est un comportement de sécurité volontaire. TinyMCE filtre le HTML pour éviter les injections XSS.\u003C\u002Fp>\n\u003Ch3>Solutions\u003C\u002Fh3>\n\u003Col>\n\u003Cli>**Désactiver TinyMCE temporairement** — Dans le back-office, vous pouvez basculer en mode \"code source\" (bouton `\u003C>` dans la barre d'outils TinyMCE) pour insérer du HTML brut. Attention : à la prochaine édition, TinyMCE pourrait re-filtrer votre code.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Col>\n\u003Cli>**Configurer TinyMCE pour autoriser les scripts** — Modifiez la configuration TinyMCE dans `js\u002Fadmin\u002Ftinymce.inc.js` :\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cpre>\u003Ccode class=\"language-javascript\">\nextended_valid_elements: 'script[src|type|async|defer]',\nvalid_children: '+body[script],+div[script]',\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>⚠️ \u003Cstrong>Attention\u003C\u002Fstrong> : cette approche est déconseillée en production car elle ouvre la porte aux injections XSS, surtout si plusieurs utilisateurs ont accès au back-office.\u003C\u002Fp>\n\u003Col>\n\u003Cli>**La bonne solution : utiliser un module** — Plutôt que de combattre TinyMCE, créez un module qui injecte le script via un hook. C'est plus propre, plus sûr, et survivra aux mises à jour.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch2>Exemple pratique : un bouton \"Voir plus\" sur la description\u003C\u002Fh2>\n\u003Cp>Voici une implémentation complète et moderne d'un système de troncature de description :\u003C\u002Fp>\n\u003Ch3>Le JavaScript (fichier externe)\u003C\u002Fh3>\n\u003Cpre>\u003Ccode class=\"language-javascript\">\ndocument.addEventListener('DOMContentLoaded', function () {\n    var description = document.querySelector('.product-description');\n    if (!description) return;\n\n    var maxHeight = 200; \u002F\u002F hauteur en pixels avant troncature\n    if (description.scrollHeight <= maxHeight) return;\n\n    description.style.maxHeight = maxHeight + 'px';\n    description.style.overflow = 'hidden';\n    description.style.transition = 'max-height 0.4s ease';\n\n    var toggleBtn = document.createElement('button');\n    toggleBtn.className = 'btn btn-link btn-toggle-description';\n    toggleBtn.textContent = 'En savoir plus';\n    toggleBtn.setAttribute('aria-expanded', 'false');\n\n    toggleBtn.addEventListener('click', function () {\n        var isExpanded = toggleBtn.getAttribute('aria-expanded') === 'true';\n        if (isExpanded) {\n            description.style.maxHeight = maxHeight + 'px';\n            toggleBtn.textContent = 'En savoir plus';\n            toggleBtn.setAttribute('aria-expanded', 'false');\n        } else {\n            description.style.maxHeight = description.scrollHeight + 'px';\n            toggleBtn.textContent = 'Réduire';\n            toggleBtn.setAttribute('aria-expanded', 'true');\n        }\n    });\n\n    description.parentNode.insertBefore(toggleBtn, description.nextSibling);\n});\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch3>Le CSS associé\u003C\u002Fh3>\n\u003Cpre>\u003Ccode class=\"language-css\">\n.product-description {\n    position: relative;\n}\n\n.product-description[style*=\"overflow: hidden\"]::after {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 60px;\n    background: linear-gradient(transparent, white);\n    pointer-events: none;\n}\n\n.btn-toggle-description {\n    display: block;\n    margin: 10px auto;\n    font-weight: 600;\n}\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch2>Bonnes pratiques à retenir\u003C\u002Fh2>\n\u003Col>\n\u003Cli>**Privilégiez toujours un module** plutôt qu'une modification directe des templates. Les mises à jour de thème écraseront vos modifications.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Col>\n\u003Cli>**Chargez vos scripts en `defer` ou `async`** pour ne pas bloquer le rendu de la page. Le temps de chargement impacte directement le taux de conversion.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Col>\n\u003Cli>**Utilisez `document.addEventListener('DOMContentLoaded', ...)`** plutôt que de placer vos scripts en fin de page. C'est plus fiable, surtout avec les mécanismes de cache.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Col>\n\u003Cli>**Ne modifiez jamais la configuration TinyMCE pour autoriser les scripts** dans le contenu éditorial. C'est une faille de sécurité.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Col>\n\u003Cli>**Testez sur mobile** : les interactions JavaScript (hover, scroll, toggle) se comportent différemment sur écran tactile.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Col>\n\u003Cli>**Versionnez vos scripts** en ajoutant un paramètre de version (`?v=1.2`) ou en utilisant le système de cache-busting natif de PrestaShop via `registerJavascript`.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch2>Récapitulatif par version\u003C\u002Fh2>\n\u003Ctr>\u003Cth>Version\u003C\u002Fth>\u003Cth>Méthode recommandée\u003C\u002Fth>\u003Cth>À éviter\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>**1.6**\u003C\u002Fth>\u003Cth>`{literal}` dans `footer.tpl` avec condition `{if $page_name == 'product'}`\u003C\u002Fth>\u003Cth>Injection dans la description longue\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>**1.7**\u003C\u002Fth>\u003Cth>Module + hook `actionFrontControllerSetMedia` + `registerJavascript`\u003C\u002Fth>\u003Cth>Modification directe des templates core\u003C\u002Fth>\u003C\u002Ftr>\n\u003Ctr>\u003Cth>**8.x**\u003C\u002Fth>\u003Cth>Module + `registerJavascript` avec attribut `defer`\u003C\u002Fth>\u003Cth>Édition de `product.tpl` du thème parent\u003C\u002Fth>\u003C\u002Ftr>",[41,44,47,50,53,56,59],{"q":42,"a":43},"Pourquoi mon JavaScript ne fonctionne pas dans la description produit PrestaShop ?","L'éditeur de texte riche TinyMCE, utilisé dans le back-office PrestaShop, filtre automatiquement les balises \u003Cscript> pour des raisons de sécurité. Votre code JavaScript est tout simplement supprimé à la sauvegarde. La solution recommandée est de passer par un module qui injecte le script via un hook comme displayFooterProduct ou actionFrontControllerSetMedia.",{"q":45,"a":46},"Comment ajouter du JavaScript uniquement sur les pages produits et pas sur tout le site ?","En PrestaShop 1.6, utilisez la condition Smarty {if $page_name == 'product'} dans votre footer.tpl. En 1.7 et 8.x, utilisez le hook actionFrontControllerSetMedia dans un module et vérifiez que le contrôleur courant est bien ProductController avant d'appeler registerJavascript. Ainsi, le script ne sera chargé que sur les fiches produits.",{"q":48,"a":49},"Quelle est la différence entre {literal} et registerJavascript dans PrestaShop ?","La balise {literal} est une directive Smarty (moteur de template de PrestaShop 1.6\u002F1.7) qui empêche l'interprétation des accolades JavaScript. C'est une solution rapide mais fragile car elle implique de modifier les fichiers de thème directement. La méthode registerJavascript, disponible à partir de PrestaShop 1.7, est une API PHP qui gère le chargement des fichiers JavaScript de manière propre, avec contrôle de la position, de la priorité et du cache-busting.",{"q":51,"a":52},"Peut-on utiliser jQuery dans un script personnalisé sur une fiche produit PrestaShop ?","Oui, jQuery est inclus nativement dans PrestaShop (toutes versions). Cependant, en 1.7 et 8.x, jQuery est chargé via le thème et peut ne pas être disponible si votre script s'exécute trop tôt. Utilisez jQuery(document).ready() ou mieux, chargez votre script avec l'option position: 'bottom' via registerJavascript pour garantir que jQuery est déjà disponible.",{"q":54,"a":55},"Comment déboguer un script JavaScript sur une page produit PrestaShop ?","Ouvrez les DevTools de votre navigateur (F12), onglet Console, pour repérer les erreurs JavaScript. Vérifiez l'onglet Network pour confirmer que votre fichier JS est bien chargé. En PrestaShop 1.6, désactivez la combinaison CSS\u002FJS (Préférences > Performances) et videz le cache Smarty. En 1.7\u002F8.x, désactivez le cache de template dans Paramètres avancés > Performances et passez en mode debug en mettant _PS_MODE_DEV_ à true dans config\u002Fdefines.inc.php.",{"q":57,"a":58},"Mon JavaScript provoque un conflit avec le thème PrestaShop, que faire ?","Les conflits surviennent souvent à cause de collisions de noms de fonctions ou de variables globales. Encapsulez systématiquement votre code dans une IIFE (Immediately Invoked Function Expression) : (function() { \u002F* votre code *\u002F })(); Utilisez aussi des sélecteurs CSS spécifiques (préfixés par votre module) plutôt que des sélecteurs génériques comme .description ou #content.",{"q":60,"a":61},"Est-il possible d'ajouter du JavaScript conditionnel selon la catégorie du produit ?","Oui. Dans un module, récupérez la catégorie du produit courant via $this->context->controller->getProduct()->id_category_default, puis conditionnez l'appel à registerJavascript en fonction de cette valeur. En Smarty (1.6), vous pouvez tester {if $product->id_category_default == 42} pour cibler une catégorie spécifique.","Pour intégrer du JavaScript sur une fiche produit PrestaShop, utilisez {literal} dans les templates Smarty en 1.6, ou créez un module avec registerJavascript via le hook actionFrontControllerSetMedia en 1.7\u002F8.x. Évitez d'insérer du JS dans la description longue car TinyMCE le supprime.",6,"2026-03-21T13:35:48.000Z",[],"PrestaShop pour les développeurs",{"footer":68},{"theme":69,"description":70,"hours":70,"logo":71,"contact":75,"social":76,"bottomBar":86},"dark",null,{"src":72,"href":73,"alt":74},"\u002Flogo-ac.svg","\u002F","Alexandre Carette",{"email":70,"phone":70,"address":70,"cta":70},[77,80,83],{"platform":78,"href":79,"label":78},"linkedin","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Falexandre-carette\u002F",{"platform":81,"href":82,"label":81},"malt","https:\u002F\u002Fwww.malt.fr\u002Fprofile\u002Falexandrecarette",{"platform":84,"href":85,"label":84},"github","https:\u002F\u002Fgithub.com\u002Fprest4cafe",{"copyright":70},{"columns":88},[89,105,135,156],{"title":90,"links":91},"Plateforme",[92,96,99,102],{"label":93,"href":94,"external":95},"Offre Starter (2 500 €)","\u002Foffre-starter",false,{"label":97,"href":98,"external":95},"Devenir Ambassadeur","\u002Fambassadeur",{"label":100,"href":101,"external":95},"Modules PrestaShop","\u002Fmodules",{"label":103,"href":104,"external":20},"CodeMyShop.com","https:\u002F\u002Fcodemyshop.com",{"title":106,"links":107},"Le Synedre",[108,111,114,117,120,123,126,129,132],{"label":109,"href":110,"external":95},"L'histoire","\u002Fsynedre",{"label":112,"href":113,"external":95},"Constitution","\u002Fsynedre\u002Fconstitution",{"label":115,"href":116,"external":95},"L'équipe","\u002Fequipe",{"label":118,"href":119,"external":95},"Le réacteur en direct","\u002Freacteur",{"label":121,"href":122,"external":95},"Le Drill (entraînement)","\u002Fdrill",{"label":124,"href":125,"external":95},"Protocole de réunion","\u002Fsynedre\u002Freunion",{"label":127,"href":128,"external":95},"Les agents IA","\u002Fagents-ia",{"label":130,"href":131,"external":95},"La Conduite","\u002Fsynedre\u002Fconduite",{"label":133,"href":134,"external":95},"Charte plateforme","\u002Fsynedre\u002Fcharte",{"title":136,"links":137},"Ressources",[138,141,144,147,150,153],{"label":139,"href":140,"external":95},"Blog","\u002Fblog",{"label":142,"href":143,"external":95},"Academy","\u002Facademy",{"label":145,"href":146,"external":95},"Dictionnaire","\u002Fdictionnaire",{"label":148,"href":149,"external":95},"Expertise PrestaShop","\u002Fexpertise",{"label":151,"href":152,"external":95},"Flywheel","\u002Fflywheel",{"label":154,"href":155,"external":95},"Manifeste","\u002Fmanifeste",{"title":157,"links":158},"À propos",[159,161,164],{"label":74,"href":160,"external":95},"\u002Fa-propos",{"label":162,"href":163,"external":95},"Dossier de presse","\u002Fpresse",{"label":165,"href":166,"external":95},"Contact","\u002Fcontact",{"header":168},{"logo":169,"topBar":172,"contactEmail":175,"features":176,"navBar":70},{"src":72,"alt":170,"text":74,"href":73,"class":171},"Alexandre Carette — Architecte E-commerce Souverain","h-10 w-10",{"message":70,"showLanguages":95,"align":173,"languages":174},"left",[],"contact@alexandrecarette.fr",{"showSearch":95,"showWishlist":95,"showLogin":20,"showContact":95,"showCart":95,"stickyHeader":20,"headerLayout":177},"inline",{"items":179},[180,188,194,200,208,216,222,227],{"id":181,"type":182,"label":183,"href":149,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":70,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":185,"children":186,"psChildren":187},41,"link",{"fr":184},"Expertise",0,[],[],{"id":189,"type":182,"label":190,"href":140,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":70,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":191,"children":192,"psChildren":193},42,{"fr":139},1,[],[],{"id":195,"type":182,"label":196,"href":101,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":70,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":197,"children":198,"psChildren":199},43,{"fr":100},2,[],[],{"id":201,"type":182,"label":202,"href":204,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":70,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":205,"children":206,"psChildren":207},44,{"fr":203},"Outils IA","\u002Foutils-ia",3,[],[],{"id":209,"type":182,"label":210,"href":94,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":212,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":213,"children":214,"psChildren":215},45,{"fr":211},"Offre Starter ✨",{"highlight":20},4,[],[],{"id":217,"type":182,"label":218,"href":143,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":70,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":219,"children":220,"psChildren":221},46,{"fr":142},5,[],[],{"id":223,"type":182,"label":224,"href":160,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":70,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":63,"children":225,"psChildren":226},47,{"fr":157},[],[],{"id":228,"type":182,"label":229,"href":166,"icon":70,"description":70,"badge":70,"groupTitle":70,"style":70,"gridColumns":70,"cssClass":70,"psCategoryId":70,"showPsChildren":95,"position":230,"children":231,"psChildren":232},48,{"fr":165},7,[],[],{"academy":234,"blog":235,"expertise":246},[],[236,240,243],{"title":237,"url":238,"score":191,"type":239},"PrestaShop headless avec Nuxt 3 : pourquoi séparer back et front","\u002Fblog\u002Fprestashop\u002Farchitecture\u002Fprestashop-headless-nuxt-separation-front-back","blog",{"title":241,"url":242,"score":191,"type":239},"PrestaShop headless : Nuxt 3, pas Next.js — le choix souverain","\u002Fblog\u002Fprestashop\u002Farchitecture\u002Fprestashop-headless-nuxt-nextjs-souverainete",{"title":244,"url":245,"score":191,"type":239},"Sylius rachète PrestaShop : ce que ça change pour vous","\u002Fblog\u002Fprestashop\u002Farchitecture\u002Fsylius-rachat-prestashop-headless-souverainete",[]]