La home d’un site marchand vélo se joue dans les 600 premiers pixels visibles. Au-dessus du fold, l’utilisateur doit comprendre en 3 secondes : « c’est un vélociste, ils ont un magasin, ils proposent atelier + essai + financement, et voilà à quoi ça ressemble ». Pas un slider générique de promo.
Le module Veloland Home Blocks fournit un hero éditable + 3 cards services configurables depuis le BO, sans toucher au thème.
Côté client : la home efficace
L’agencement par défaut :
- Hero plein écran (image ou vidéo) avec titre, sous-titre, 1 ou 2 boutons d’action
- Trois cards en grille horizontale : Atelier, Essai gratuit, Financement (libellés + icônes paramétrables)
- Optionnel : USP en bande horizontale (ex. « Livraison Lorient en 24h | Click&Collect | Pro depuis 1985 »)
Chaque bloc est éditable au BO : image, titre, sous-titre, lien, ouverture nouvel onglet, ordre, activation/désactivation. Les composants sont stylés au thème Veloland (Tailwind + BEM) — pas de breakage si on change la palette ou la police principale.
Côté technique
Le module ajoute à PrestaShop 9 une unique table vlhomeblocks_block qui stocke chaque bloc home avec son ordre d’affichage, son type, son titre, son sous-titre, son image, son lien et son état actif ou inactif. Le rendu est branché sur le hook displayHome standard de PrestaShop, ce qui le rend transparent pour le thème : aucun fichier .tpl n’a besoin d’être modifié pour intégrer le module.
Le hero principal est rendu via une balise <picture> qui expose les sources AVIF, WebP et JPG pré-générées via le hook image du module socle Veloland. Cette cohérence avec les optimisations site garantit que le hero — souvent l’élément LCP de la page d’accueil — bénéficie des meilleures performances PageSpeed.
Les trois cards services en dessous sont rendues directement en Smarty via un foreach sur les blocs actifs, sans aucune librairie de carousel JavaScript. Tout est statique, généré côté serveur, et optimal en LCP et en FCP. La maintenance se résume à éditer le contenu d’un bloc depuis le BO, sans toucher au thème.
Pourquoi c’est pertinent pour un vélociste
Une home de vélociste qui démarre par un slider produit, c’est un site comme tous les autres. Une home qui démarre par « atelier + essai + financement » + une vraie photo de magasin, c’est un site qui dit clairement « on n’est pas un pure player, on est un magasin spécialisé avec des humains ». Le taux de rebond chute, le taux de pages/visite monte.
