Mise en place du site
Le site a été réalisé à l’aide de WordPress avec le thème Astra, permettant une personnalisation avancée de la mise en page et du design. L’outil de création par blocs ( éditeur Gutenberg) a été utilisé pour structurer les différentes pages du site.
Personnalisation de la page d’accueil
La page d’accueil a été modifiée en utilisant :
- des blocs ( groupes, colonnes, images, titres)
- une réorganisation des sections existantes
- la suppression de certains éléments non pertinents
Un travail a été effectué sur :
- le centrage des éléments
- l’alignement des colonnes
- l’adaptation des images ( taille, positionnement )
Personnalisation du design
Le design du site a été personnalisé via :
- apparence -> Personnaliser
- modification des couleurs globales
- ajout d’un arrière-plan personnalisé ( image répétée )
- ajustement de la largeur du contenu
Cela a permis d’obtenir une interface cohérente sur l’ensemble des pages.
Mise en place de la boutique ( wooCommerce)
Une boutique a été créée à l’aide de l’extension WooCommerce.
Les actions réalisées :
- ajout de produits (nom, prix, image, stock)
- création et gestion de catégories de produits
- attribution des produits à chaque catégorie
- configuration de l’affichage de la boutique : affichage par catégories, réglage du nombre de colonnes, organisation des produits
Structuration des catégories
Les produits ont été organisés en catégories afin de faciliter la navigation : produits alimentaires, accessoires, vente de chats
Chaque catégorie a été configurée avec une image et un affichage adapté dans la boutique.
Page de contact
La page contact comprend :
- un formulaire de contact
- une adresse mail intégrée avec lien cliquable ( mailto )
cela permet une interaction direct avec l’utilisateur.
Prise de rendez-vous
Une page de prise de rendez-vous a été mise en place avec un système permettant :
- la sélection d’un service
- le choix d’une date et d’un horaire
- la saisie des informations utilisateur
Optimisation de la bannière d’accueil
Utilisation du bloc “bannière” pour intégrer une image en pleine largeur.
Ajout d’un bloc “espaceur” afin d’ajuster le positionnement vertical du contenu
Paramétrage de l’alignement du texte et du boiton pour un rendu centré
Désactivation de l’en-tête sur la page “Bienvenue” via les réglages du thème Astra pour créer une page d’introduction sans navigation.
Mise en place et structuration du menu de navigation
- Création d’une nouvelle rubrique ” concours” dans le menu principal du site
- organisation des sous-pages hiérarchisées : s’inscrire au concours, gagnants des édictions précédentes
- Ajustement manuel de la structure du menu via “apparences > menus :
- gestion des niveaux ( lent/ sous-menu)
- correction des problèmes d’alignement des sous-éléments
- optimisation de l’affichage déroulant
- résolution d’un problème technique liée à la hiérarchie :
- mauvais positionnement d’un sous élément ( niveau 3 au lieu de 2 )
Intégration du contenu dynamique
- ajout d’un formulaire d’inscription concours via les blocs wordpress
- personnalisation des champs
Ajout d’un spider d’images sur la page d’accueil
Dans le but de rendre le site plus dynamique et attractif, j’ai ajouté un slider.
Pour cela, j’ai utilisé le bloc ” spider” proposé par l’extension spectra.
Regardez jusqu’au bout le slider, car les images de chat sont drôles !
J’ai ensuite configuré les paramètres du slider en activant :
- la lecture automatique ( autoplay)
- la boucle continue (loop)
- ainsi qu’un défilement toute les 3 secondes
Mise en place d’un produit avec différentes options de poids (500g,1kg,2kg) et configuration de prix variables pour chaque format afin d’adapter l’offre aux besoins du client
J’ai ajouté une page dédiée à la “FAQ” en utilisant un bloc “accordion” dans l’éditeur wordpress.
Ce bloc permet d’afficher les questions sous forme de menus déroulants, ce qui rend la navigation plus claire et interactive .
Conclusion
Ce projet m’a permis de prendre en main WordPress, de gérer la création de pages, l’intégration de fonctionnalités ( boutique, avis, FAQ) et l’organisation du contenu.
Je me suis appuyée sur un outil d’intelligence artificielle pour m’accompagner dans certaines étapes techniques. (chatgpt +)