index-shop/assets/snipcart-archive/README.md

# 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
   <?php snippet('footer', ['scripts' => ['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