Amélioration d'une boutique Virtuemart

Imprimer

Note des utilisateurs: / 3
MauvaisTrès bien 

Dynamiser une boutique E-commerce, c'est intéresser le prospect. C'est lui indiquer ce qu'il doit acheter. C'est lui montrer que notre boutique est visuellement bien, et lui donner envie d'acheter.


Je sais, 'lui indiquer ce qu'il doit acheter'' n'est pas politiquement beau, mais commercialement parlant, avouez que c'est bien ce que vous voulez.


Je ne parlerai ni design, ni structure, ni référencement. Bien qu'il y ait pas mal à dire, il existe un système simple et efficace pour orienter l'achat.


Une question se pose :

comment mettre en valeur un produit, un article pour que le client puisse avoir envie d'aller plus loin, de l'acheter ?


Comment mettre en valeur UN seul produit par page. Oui l'être humain, même s'il est capable d'enregistrer rapidement jusqu'à 7 items de menu ne peut pas être intéressé par plusieurs articles en même temps. D'ailleurs il ne vaut mieux pas. On attire sur un produit phare, pas sur plusieurs.


La page d'accueil d'un site peut être la page de prédilection, mais la page des browses sur virtuemart est à mon avis la page décisionnelle. On offre ce que les gens aiment : du choix !


Une personne qui sélectionne une catégorie, c'est bien qu'elle veut en savoir plus sur les produits qui en font partie. Alors si on arrive à l'intéresser rapidement par un visuel rapide, elle n'ira pas sur un autre site.


Faîtes un test sur la page test ici . Il y a une chose qui vous attire l'oeil, c'est bien l'animation.


Vous voulez faire pareil sur votre site ? Allons y.


En premier téléchargez le module mod_vmreelview.


Ensuite commençons la configuration.


Installez le module comme tous les autres (menu extensions/installer).

Positionnez votre module dans une position non utilisee par votre template(pour l'instant, nous nous en servirons plus tard pour un autre tuto). Activez le.



Pre requis : Modification du shop.browse pour l affichage de la variable produit special dans le browse :


root/administrator/components/com_virtuemart/html/shop.browse.queries


Ajout de `product_special` ligne 36 a 41

(explication : on ajoute à la requete qui va lister les produit sur le browse, la caractéristique du produit spécial)


  1. // These are the names of all fields we fetch data from $fieldnames = "`#__{vm}_product`.`product_id`, `product_name`, `products_per_row`, `category_browsepage`, `category_flypage`, `#__{vm}_category`.`category_id`, `product_full_image`, `product_thumb_image`, `product_s_desc`, `product_parent_id`, `product_publish`, `product_in_stock`, `product_sku`, `product_url`, `product_weight`, `product_weight_uom`, `product_length`, `product_width`, `product_height`, `product_lwh_uom`, `product_available_date`, `product_availability`, `product_special`, `#__{vm}_product`.`mdate`, `#__{vm}_product`.`cdate`"; $count_name = "`#__{vm}_product`.`product_id`, `product_name`, `products_per_row`, `category_browsepage`, `category_flypage`, `#__{vm}_category`.`category_id`, `product_full_image`, `product_thumb_image`, `product_s_desc`, `product_parent_id`, `product_publish`, `product_in_stock`, `product_sku`, `product_url`, `product_weight`, `product_weight_uom`, `product_length`, `product_width`, `product_height`, `product_lwh_uom`, `product_available_date`, `product_availability`, `product_special`, `#__{vm}_product`.`mdate`, `#__{vm}_product`.`cdate`"; $table_names = '`#__{vm}_product`, `#__{vm}_category`, `#__{vm}_product_category_xref`,`#__{vm}_shopper_group`'; $join_array = array( '`#__{vm}_product`, `#__{vm}_category`, `#__{vm}_product_category_xref`,`#__{vm}_shopper_group`' ); $where_clause = array();-1


root/administrator/components/com_virtuemart/html/shop.browse


Ligne 460 (environ)


ajout de :

  1. $products[$i]['product_special'] = $db_browse->f("product_special");0


(explication : on ajoute au template browse la caracteristique du produit special pour l affichage)


Ensuite modifiez le browse pour que le code fonctionne. (cf info.php dans le module)

Il ne reste plus qu a mettre des images dans le bon dossier :


  1. L'image du produit normal (le thumb) qui est à copier/coller du component/com_virtuemart/shop_image/product vers /module/com_vmreelview/samples/. Attention, selon la dimension de votre thumb, il faut modifier la taille de l'image insérée dans le browse.

  2. Créer ensuite un répertoire au NOM du produit.

  3. Placer y dedans la série d'image sous forme 1.png,2.png....)



Vous avez un exemple d images dans le dossier pour vous aider.


Astuces : Vous pouvez ensuite definir le produit special comme premier produit de votre browse en modifant les requetes, cela vous permettra d avoir en tete de liste pour chaque page un produit anime (produit de la semaine,...) Si vous desirez mettre une image a cote de l animation , vous pouvez utiliser une id pour inserer l image dans le browse.


Le css superpose est dans le css du module.


Merci de ne pas recopier l'image promo, un peu de boulot quand même !!!!


Vous avez maintenant un produit que vous pouvez faire tourner sur lui même en x ou y !

Essayez! passez votre souris dessus, cliquez sur le boutoin de gauche en étant sur l'image et maintenez cliqué. Bougez, admirer votre produit !


Le module fonctionne sous FF,IE,Safari.