Développemennt du mockup
🛠️ TP WordPress – Séance 3 : Personnalisation et finalisation du site e-commerce
🎯 Objectifs de la séance
- Personnaliser l’apparence générale du site
- Créer un menu de navigation complet
- Vérifier le bon fonctionnement de toutes les pages
- Présenter le site finalisé
⏱️ Durée : 2h
🔧 Pré-requis :
- WooCommerce configuré
- Produits ajoutés (minimum 3)
- Pages principales créées
🧭 Étapes du TP
1. Personnaliser un thème (30 min)
- Aller dans Apparence > Personnaliser pour :
- Ajouter un logo (optionnel)
- Modifier les couleurs principales (boutons, texte, fond…)
- Changer la typographie si souhaité
- Adapter l’en-tête et le pied de page
💡 Utilisez une palette harmonieuse. Vous pouvez vous inspirer de : https://coolors.co/
2. Créer et organiser le menu principal (15 min)
-
Aller dans Apparence > Menus.
-
Créer un nouveau menu appelé
Menu principal. -
Ajouter les pages suivantes :
- Accueil
- Boutique
- À propos
- Contact
- (Optionnel) Catégories de produits
-
Définir ce menu comme menu principal dans l’en-tête.
3. Vérifications générales (15 min)
Passez en revue votre site pour vérifier :
- Affichage correct sur ordinateur
- Navigation fluide et logique
- Tous les liens fonctionnent
- Produits bien affichés dans la boutique
- Panier et commande testés une dernière fois
4. (Bonus) Ajouter un plugin utile (15 min)
Exemples de plugins gratuits à tester :
- Contact Form 7 (formulaire de contact)
- Elementor (constructeur de pages)
- Smash Balloon Instagram Feed (intégration Instagram)
- MailPoet (newsletter)
N’installez pas plus d’un ou deux plugins, restez légers.
5. Présentation de la boutique (45 min)
Chaque étudiant (ou groupe) présentera rapidement sa boutique :
- Nom de la boutique et identité visuelle
- Produits proposés
- Organisation du site
- Points forts / difficultés rencontrées
⏱️ Durée recommandée : 5 minutes par présentation
✅ Travail attendu à la fin de la séance
- Site e-commerce complet, esthétique et fonctionnel
- Menu de navigation clair
- Personnalisation visible
- Présentation orale réalisée
📊 Évaluation (rappel)
| Critère | Points |
|---|---|
| Pages de base (Accueil, Boutique, Contact, etc.) | 5 pts |
| WooCommerce installé et configuré | 3 pts |
| Produits bien renseignés (≥ 3, avec photo) | 5 pts |
| Thème et personnalisation (logo, menu, design) | 4 pts |
| Cohérence du site et ergonomie | 3 pts |
| Total | /20 |
✅ Bonus : +1 pt pour l’ajout d’un plugin pertinent
📝 Conseils finaux
- Faites des captures d’écran de votre site en cas de bug
- Sauvegardez votre dossier LocalWP ou vos fichiers WordPress localement
- Soyez créatifs et professionnels dans vos présentations