# Archive Snipcart Cette archive contient tous les fichiers et le code nécessaires pour réactiver l'intégration Snipcart si besoin. ## Date d'archivage 13 janvier 2026 ## Raison de l'archivage Remplacement par l'intégration Shopify Buy Button --- ## Fichiers archivés ### Fichiers JavaScript - `snipcart.js` - Loader Snipcart avec configuration de la clé API - `product-size.js` - Gestion des options produit (tailles, etc.) pour Snipcart ### Fichiers SCSS - `_snipcart.scss` - Styles pour le modal Snipcart --- ## Comment restaurer l'intégration Snipcart ### 1. Restaurer les fichiers JavaScript #### Fichier: `assets/js/snipcart.js` Copier le fichier depuis l'archive: ```bash cp assets/snipcart-archive/snipcart.js assets/js/ ``` #### Fichier: `assets/js/product-size.js` Copier le fichier depuis l'archive: ```bash cp assets/snipcart-archive/product-size.js assets/js/ ``` ### 2. Restaurer les styles SCSS #### Fichier: `assets/css/template/shop/_snipcart.scss` Copier le fichier depuis l'archive: ```bash cp assets/snipcart-archive/_snipcart.scss assets/css/template/shop/ ``` Puis décommenter l'import dans `assets/css/style.scss`: ```scss // Décommenter cette ligne: @import 'template/shop/snipcart'; ``` ### 3. Restaurer le template produit #### Fichier: `site/templates/product.php` 1. **Restaurer le bouton "Ajouter au panier" avec les attributs Snipcart** (ligne ~40-78): - Décommenter tous les attributs `data-item-*` du bouton - Ajouter la classe `snipcart-add-item` au bouton 2. **Restaurer les scripts dans le footer** (ligne 114): ```php ['assets/js/product-size.js', 'assets/js/snipcart.js', 'assets/js/product-gallery.js']]) ?> ``` ### 4. Restaurer les routes et webhooks #### Fichier: `site/config/config.php` Décommenter les routes Snipcart (lignes 39-147): 1. **Route de validation produit** (`validate.json`): - Permet à Snipcart de valider les prix et stock - Route: `(:any)/validate.json` 2. **Webhook Snipcart**: - Gère les événements de commande (décrémente le stock) - Route: `snipcart-webhook` ### 5. Configuration Snipcart #### Clé API publique La clé API publique Snipcart est dans `snipcart.js`: ```javascript publicApiKey: 'NGU4ODQ3MjAtY2MzMC00MWEyLWI2YTMtNjBmNGYzMTBlOTZkNjM4OTY1NDY4OTE5MTQyMTI3' ``` #### Configuration du webhook Pour que le webhook fonctionne, il faut: 1. Configurer l'URL du webhook dans le dashboard Snipcart 2. URL: `https://votre-domaine.com/snipcart-webhook` 3. Événements à écouter: `order.completed` ### 6. Vérifications après restauration - [ ] Les fichiers JS sont présents dans `assets/js/` - [ ] Le fichier SCSS est présent et importé - [ ] Les boutons "Ajouter au panier" ont la classe `snipcart-add-item` - [ ] Les attributs `data-item-*` sont présents sur les boutons - [ ] Les routes sont décommentées dans `config.php` - [ ] Le CSS de Snipcart est compilé - [ ] Le webhook est configuré dans le dashboard Snipcart - [ ] Les traductions sont restaurées dans `site/languages/en.php` et `fr.php` --- ## Fonctionnalités Snipcart implémentées ### Gestion des produits - Affichage du prix - Options de produit (tailles, couleurs, etc.) - Validation des options obligatoires - Images produit ### Gestion du panier - Ajout au panier - Gestion du stock - Calcul des frais de port (basé sur poids/dimensions) - Validation des prix côté serveur ### Gestion des commandes - Webhook pour décrémenter le stock automatiquement - Redirection vers page de remerciement après paiement - Token de commande dans l'URL ### Multi-langue - Support FR/EN - Redirection post-paiement avec détection de la langue --- ## Dépendances externes ### CDN Snipcart Snipcart est chargé depuis le CDN officiel: - Version: 3.0 - JS: `https://cdn.snipcart.com/themes/v3.0/default/snipcart.js` - CSS: `https://cdn.snipcart.com/themes/v3.0/default/snipcart.css` ### Stratégie de chargement - `loadStrategy: 'on-user-interaction'` - Chargement différé pour optimiser les performances - Timeout: 2750ms --- ## Notes importantes 1. **Sécurité**: Le webhook devrait valider la signature Snipcart en production (voir commentaire dans `config.php`) 2. **Stock**: Le système décrémente automatiquement le stock via le webhook `order.completed` 3. **Validation**: Chaque produit expose une route `validate.json` pour que Snipcart puisse vérifier les prix 4. **Multi-langue**: La redirection post-paiement détecte automatiquement la langue depuis l'URL --- ## Support Pour toute question sur Snipcart: - Documentation: https://docs.snipcart.com/ - Support: https://snipcart.com/support