Modifier un élément de template dans wpshop

Il est possible de personnaliser chaque élément de wpshop en outrepassant les template définis par défaut ( ATTENTION: en faisant cela vous n’aurez plus accès à toutes les fonctionnalités qui pourrait être ajoutée au fil des versions ). Le principe de fonctionnement est assez similaire à celui de worpdress au niveau des thèmes parents/enfants, c’est à dire que dans un premier temps nous allons vérifier l’existence du fichier de template dans le thème courant, si il existe nous allons prendre les éléments contenu dans ce fichier en priorité, si il n’existe pas nous allons prendre le fichier principal contenu dans le plugin wpshop.

Lors des différentes mise à jour nous modifions et livrons un fichier principal qui contient en grande partie les éléments permettant d’afficher les contenus de wpshop dans la partie frontend du site. Ces élements sont livrés dans le fichier :
main_elements.tpl.php se trouvant dans /wp-content/plugins/wpshop/templates/wpshop/

Si vous souhaiter ajouter ou supprimer des éléments d’affichage dans wpshop vous avez la possibilité d’outrepasser ce fichier, pour cela il vous faut créer dans votre thème un dossier /www/wp-content/themes/votre_theme/wpshop ( « votre_theme » étant le nom de votre thème. Le dossier wpshop doit normalement déjà exister, si ce n’est pas le cas, il faudra le créer) dans ce dossier il va vous falloir créer un fichier se nommant comme le fichier principal de wpshop c’est à dire main_elements.tpl.php

Dans ce fichier nous allons commencer par mettre à la ligne 1 la balise d’ouverture de php c’est à dire « <?php »

NB: Dans la suite de cette documentation nous allons considérer que nous voulons modifier la disposition de la fiche produit.

1- Dans le fichier principal de wpshop c’est à dire: /wp-content/plugins/wpshop/templates/wpshop/main_elements.tpl.php rechercher le texte « product_complete_tpl » (Dans la version 1.3.9.7 il se trouve à la ligne 483)

Bloc d'affichage de la fiche produit par défaut wpshop version 1.3.9.7

Bloc d’affichage de la fiche produit par défaut wpshop version 1.3.9.7

2- Copier le bloc ( chaque partie de template commence par « ob_start() » et se termine par « ob_end_clean() » ), dans notre exemple le bloc a copier commence à la ligne 450 et se termine à la ligne 484

3- Coller ce bloc dans le fichier que vous aurez créer dans votre thème c’est à dire: /www/wp-content/themes/votre_theme/wpshop/main_elements.tpl.php. Votre fichier doit maintenant ressembler à

Bloc d'affichage de la fiche du produit dupliqué dans le thème

Bloc d’affichage de la fiche du produit dupliqué dans le thème

20150325_fiche_produit_avant

Pour le moment il n’y a aucune différence d’affichage car nous n’avons fait que dupliquer le bloc.

4- Nous allons déplacer le prix à coté du bouton « ajouter au panier ».
Pour cela dans le fichier que nous avons dupliqué, nous allons prendre la ligne correspondant au prix qui est ( ligne 12 du fichier )

<div class= »wps-prices »>{WPSHOP_PRODUCT_PRICE}</div>

Nous allons la placer entre le sélecteur de quantité et le bouton ajouter au panier, c’est à dire insérer une ligne après la ligne 21 correspondant au texte: « {WPSHOP_PRODUCT_QUANTITY_CHOOSER} » Notre fichier ressemble à présent à celà

Bloc d'affichage de la ficher produit modifiée

Bloc d’affichage de la ficher produit modifiée. affichage du prix à coté du bouton ajouter au panier

20150325_fiche_produit_apres

Modifier le CSS :

  • Fichier : frontend_main.css
  • Emplacement par défaut :  /www/wp-content/plugins/wpshop/templates/wpshop/css
  • Emplacement pour modifier votre thème : /www/wp-content/themes/votre_theme/wpshop/css

Dernière mise à jour le 12 janvier 2016

Documentation Crée le 16 octobre 2015 par jimmy

Mon panier
Votre panier est vide