Magento – Manuel utilisateur Auguria DesignProduct V3 FR

Avoir un catalogue unique qui permette de se démarquer de la concurrence peut se révéler particulièrement ardu selon le secteur d’activité. Alors pourquoi ne pas laisser vos clients vous démarquer de vos concurrents en leur permettant de personnaliser leur futur achat? Auguria DesignProduct est une extension Magento permettant de définir divers gabarits de personnalisation: gravures personnalisées, textes et/ou images, donnez à vos clients le produit unique qu’il ne trouvera nulle part ailleurs !

1   Description générale du module

1.1   Principe de base

Ce module vous permet de créer des gabarits de personnalisation et de les rattacher à tous vos produits (sauf les produits groupés et les produits packagés).
En consultant le produit, vos clients pourront alors le personnaliser en y ajoutant des images ou du texte, tel que vous l’avez défini dans votre gabarit.
De votre côté, en consultant les commandes, vous aurez accès à l’image de personnalisation prête pour impression et à un fichier texte de description de la personnalisation.
Pour chaque personnalisation, il est possible d’activer ou de désactiver, indépendamment, le téléchargement de l’image de sa personnalisation, la génération d’images destinées à l’impression et la génération du fichier texte.

2   Mise en place du module

2.1   Compatibilité Magento

Ce module est compatible avec les versions 1.9 de Magento.

Il surcharge les classes :

  • Mage_Sales_Model_Quote_Item
  • Mage_Sales_Model_Order_Pdf_Items_Invoice_Default
  • Mage_Sales_Model_Order_Pdf_Items_Shipment_Default
  • Mage_Sales_Model_Order_Pdf_Items_Creditmemo_Default

2.2   Obtention du module

Pour obtenir une version du module, vous pouvez la télécharger sur notre site http://www.auguria.com

2.3   Installation

2.3.1   Pré-requis

Attention ce module nécessite la librairie PHP ImageMagick pour fonctionner. Vérifiez que votre hébergeur vous permet de l’installer et que cette librairie est bien installée sur votre serveur.

Voir http://www.php.net/manual/fr/book.imagick.php pour plus d’informations.

2.3.2   Méthodes d’installation

2.3.2.1   Magento connect 2

Vous pouvez installer des archives à partir de Magento connect en allant dans le back-office, « Système → Magento Connect → Gestion Magento Connect »

Identifiez vous.

Puis dans le cadre suivant, sélectionnez l’archive de Auguria_DesignProduct en cliquant sur « Parcourir » puis « Upload ».

2.3.2.2   Manuellement

Copiez les répertoires de l’archive directement à la racine de votre installation Magento.

3   Configuration du module

3.1   Configuration globale

Allez dans « Système → Configuration → Catalogue → Personnalisation des produits »

3.1.1   Unités de mesure

  • Taux de conversion d’un pouce dans votre unité est par défaut à 2.54 car l’unité par défaut est le centimètre. Si vous voulez exprimer les dimensions de vos gabarits en millimètres (par exemple), vous pouvez modifier cette valeur à 254. Ainsi les dimensions seront exprimées en millimètres pour être transformées en pixels en fonction du nombre de pixels par pouce.
  • Label de l’unité de mesure est le label de votre unité de mesure.

3.1.2   Contraintes sur les champs

Toutes les valeurs ci dessous sont les valeurs de paramétrage au plus haut niveau.

  • Palette de couleurs est la couleur du texte que l’on va retrouver dans la personnalisation, vous pouvez choisir toutes les couleurs ou ajouter les couleurs que vous souhaitez
  • Styles de police sont les styles de caractères que l’on va retrouver dans la personnalisation
  • Tailles de polices autorisées sont les tailles de polices que l’on va retrouver dans la personnalisation, Si vous mettez plusieurs valeurs, il faut les séparer par des virgules.
  • Nombre de caractères maximum est le nombre maximum de caractères pour un texte dans la personnalisation
  • Nombre de lignes est le nombre de lignes que l’on retrouve pour un texte dans la personnalisation

3.1.3   Image pour impression

L’impression des images est disponible dans la partie commande, facture, pdf, etc …

  • Activer à Oui pour activer la génération des images pour l’impression et à Non pour ne pas l’activer.
  • Nombre de pixels par pouce est le nombre de pixels par pouce pour l’impression des images, plus la valeur est grande, meilleure est la qualité de l’image.

Warning

Attention, cependant à uploader des images (pour les faces) de haute qualité.

3.1.4   Aperçu de la personnalisation

  • Nombre de pixels par pouce est le nombre de pixels par pouce pour l’aperçu des images, plus la valeur est grande, meilleure est la qualité de l’image.

Warning

Attention, cependant à uploader des images (pour les faces) de haute qualité.

  • Largeur en pixels est la largeur en pixele de l’aperçu des faces que l’on trouve dans les fiches produits qui disposent d’une personnalisation
  • Hauteur en pixels est la hauteur en pixel de l’aperçu des faces que l’on trouve dans les fiches produits qui dispose d’une personnalisation
  • Autoriser les clients à télécharger leurs images autorise ou non les clients à télécharger les images générées pour leur aperçu, lien que l’on retrouve dans le panier

3.1.5   Dossiers

Définit les chemins vers les dossiers.
Indiquez un chemin relatif à partir de la racine de Magento.
Par exemple, "media/designproduct/fonts" (qui peut correspondre à "/var/www/magento/media/designproduct/fonts").

3.1.6   Principe du gabarit

Supposons que vos produits soient des tee shirts.

Vous souhaitez ajouter un personnalisation sur vos tee shirts. Vous allez donc utiliser notre module Auguria DesignProduct.

La personnalisation en elle même est un produit que nous allons appeler Gabarit.

Pour avoir un tee shirt personnalisable, nous avons donc :

  • un produit simple (ou configurable)
  • un produit de type Auguria DesignProduct (notre personnalisation)

Dans ce gabarit, nous pouvons paramétrer des valeurs par défaut (valeurs globales), ce paramétrage se retrouve sur tous les niveaux (Voir chapitre sur les niveaux de paramétrage des valeurs).
Nous trouvons aussi des faces, des zones, des contenus (de type image ou texte).

Reprenons notre exemple de tee shirt, supposons nous souhaitons personnaliser le devant de notre tee shirt mais également l’arrière et ce avec différentes zones avec des contenus différents.

Exemple, Vous voulez proposer à vos clients de mettre un texte sur la face avant du tee shirt au niveau de la poitrine, un texte sur tout le bas du tee shirt et une image sur une grosse partie de la face arrière du tee shirt.

Votre gabarit (personnalisation) va donc contenir deux faces, la première face (face avant) va contenir deux zones (une zone pour la poitrine et une zone pour le bas du tee shirt) et la deuxième face va contenir une seule zone. Chaque zone va contenir un contenu soit de type texte, soit de type image.

  • Voici un schéma représentant le gabarit pour notre tee shirt :

http://blog.auguria.net/wp-content/uploads/image_attachment_2911.png

3.1.7   Niveau de paramètres

  • Voici un diagramme des différents niveaux de paramètres que l’on trouve dans la personnalisation avec un exemple pour la couleur de police :

http://blog.auguria.net/wp-content/uploads/image_attachment_2909.png

Supposons que nous choisissons la couleur de police à bleu dans la configuration par défaut (au plus haut niveau), si nos gabarits sont réglés pour avoir la couleur de police par défaut, nos textes seront donc affichés en bleu.
Maintenant, nous souhaitons un gabarit différent avec une couleur de police jaune, il nous suffit de modifier la valeur de la couleur de police dans le gabarit en question. Nous pouvons également mettre une couleur différente pour chaque face, chaque zone et chaque contenu.

Vous l’avez donc compris, si l’on spécifie une couleur mauve à un contenu (au plus bas niveau), notre texte sera donc mauve (et non pas rouge, ni jaune, ni bleu).

3.2   Création d’un gabarit de A à Z

3.2.1   Création du gabarit

  • Dans l’administration de Magento, allez dans Catalogue, puis ajoutez un produit (notre gabarit est géré comme un produit).
  • Choisissez "Design Product" dans le menu déroulant "Ensemble d’attributs"
  • Choisissez "Template Auguria DesignProduct" dans le menu déroulant
  • Cliquez sur Continuer

http://blog.auguria.net/wp-content/uploads/image_attachment_2910.png

3.2.1.1   Onglet Général
  • Nom du gabarit (visible uniquement en back-office)
  • SKU (UGS) (visible uniquement en back-office)
  • Statut : Visible ou non sur le site

INFO : Le statut se désactive automatiquement si le gabarit ne permet pas d’afficher la personnalisation (si la face ou la zone ou le contenu est désactivé)

3.2.1.2   Onglet Prix
  • Prix : Vous pouvez appliquer un prix a votre gabarit
  • Classe d’impôt : Choix de la taxe
3.2.1.3   Onglet Personnalisation des produits

Gabarit :

  • Obligatoire : Si vous mettez Oui, le bouton d’ajout au panier s’affichera une fois que la personnalisation sera remplie, Si vous mettez Non, on proposera le bouton d’ajout au panier et le bouton de personnalisation
  • Classe : Pour personnaliser certains gabarits grâce à une classe CSS

Édition de la personnalisation :

  • Autoriser les clients à télécharger l’image : Autorise ou non les clients à télécharger l’image de prévisualisation, par défaut, c’est la valeur de la configuration globale.

Configuration des options de type texte :

  • Palette de couleur : même principe que pour la configuration globale (voir chapitre Configuration globale)
  • Couleur de police par défaut : mettre une valeur se trouvant dans la palette de couleur (valeur en hexadécimal ex : #000000 pour noir)
  • Styles de police : même principe que pour la configuration globale (voir chapitre Configuration globale)
  • Police par défaut : police par défaut pour le texte
  • Texte par défaut : texte par défaut qui va s’afficher par défaut
  • Nombre de caractères maximum : même principe que pour la configuration globale (voir chapitre Configuration globale)
  • Nombre de lignes : même principe que pour la configuration globale (voir chapitre Configuration globale)
  • Tailles de police autorisées : même principe que pour la configuration globale (voir chapitre Configuration globale)
  • Taille de police par défaut : taille de police par défaut pour le texte par défaut
  • Alignement par défaut : Choisissez comment aligner horizontalement votre texte
  • Alignement vertical par défaut : Choisissez comment aligner verticalement votre texte
3.2.1.4   Onglet Faces

Dans cet onglet, nous allons gérer nos faces, cliquez sur Ajouter une face pour ajouter une nouvelle face, vous pouvez en ajouter 4 maximum.

Une fois ajoutée, on retrouve 2 onglets :

3.2.1.5   Onglet General

General :

  • Statut : Visible ou non sur le site
  • Nom dans l’administration : Visible uniquement dans l’administration
  • Nom publique : Nom de la face visible dans la personnalisation
  • Description : Description de la face visible dans la personnalisation
  • Classe : Pour personnaliser la face grâce à une classe CSS
  • Position : Détermine la position d’une face par rapport à une autre, plus la valeur est grande, plus la face apparaîtra en premier

Image de fond :

L’image de fond doit être de très bonne qualité. Le produit sur l’image doit être de préférence à plein l’image pour que les bords de l’image soient minimes. Le produit doit être de face et non de perspective sinon l’aperçu sera de mauvaise qualité.

  • Largeur : Mettez la largeur de votre produit si le produit sur l’image que vous allez associer à votre personnalisation est à plein l’image, rajoutez un peu plus selon la largeur des bords de l’image
  • Hauteur : idem que la largeur
  • Image de fond par défaut : Mettez l’image de fond par défaut, l’image apparaît ensuite à côté du bouton parcourir, ouvrez la, si elle contient des bords noirs, c’est que votre largeur ou votre hauteur n’est pas correcte, modifiez soit la largeur soit la hauteur puis remettez la même image. faites l’opération plusieurs fois pour avoir un minimum de bords noirs sur l’image.
  • Image de fond liée à un produit : Vous pouvez associer une image d’un produit et choisir le nom de l’attribut que vous souhaitez.

IMAGE

Prix :

  • Prix : le prix de votre face (vide pour ne pas l’afficher)

Édition de la personnalisation :

  • Autoriser les clients à télécharger l’image : même principe que pour la configuration globale (voir chapitre Configuration globale)

Configuration des options de type texte :

  • Même principe que pour la configuration du gabarit
3.2.1.6   Onglet Zones

Dans cet onglet, nous allons gérer nos zones pour notre face, cliquez sur Ajouter une zone pour ajouter une nouvelle zone.
Uns fois ajouté, on retrouve 3 onglets :

3.2.1.7   Onglet General
  • Même principe que pour la configuration du gabarit
3.2.1.8   Onglet Emplacement

Preview :

  • Ici, vous visualisez votre face, Si vous ne visualisez rien, c’est que vous n’avez pas enregistré votre produit. Vous pouvez sélectionner la zone qui vous intéresse directement dans l’image.

Emplacement :

  • Vous pouvez aussi remplir à la main les valeurs de la zone qui vous intéresse.

http://blog.auguria.net/wp-content/uploads/image_attachment_2932.png

3.2.1.9   Onglet Contenu

Dans cet onglet, nous allons gérer nos contenus pour notre zone, cliquez sur Ajouter un contenu pour ajouter un nouveau contenu.

  • Certaines valeurs présentent sont déjà expliquées plus haut.
  • Déformer l’image sur l’aperçu : Si vous mettez Non, l’image (image ou texte) sera déformée pour donner un effet de profondeur.
  • Type de contenu : Choisissez texte ou Image

Si vous choisissez Texte, les valeurs sont déjà expliquées plus haut.
Si vous choisissez Image :
Poids maximum de l’image : Poids maximum de l’image que les clients vont télécharger
Image par défaut : Vous pouvez mettre une image par défaut, sur le même principe que pour le texte, elle s’affichera par défaut sur la personnalisation.

3.3   Lier un gabarit à un produit

  • Dans l’administration, ouvrez une fiche produit.
  • Allez ensuite dans l’onglet "Personnalisation des produits"
  • Cliquez sur "Mettre à zéro le filtre" pour afficher tous les gabarits
  • Sélectionnez le gabarit que vous souhaitez lier.
  • Enregistrez

3.4   Mettre plusieurs images de faces avec un seul gabarit

  • Dans l’administration, ouvrez une fiche produit liée à un gabarit.
  • Allez ensuite dans l’onglet "Images"
  • Uploadez votre image pour la face
  • cochez la case qui correspond à la valeur "Image de fond liée à un produit" dans votre gabarit
  • Enregistrez

Le gabarit (dans l’onglet Face):

http://blog.auguria.net/wp-content/uploads/image_attachment_2931.png

Le produit :

http://blog.auguria.net/wp-content/uploads/image_attachment_2930.png

Ainsi, avec cette configuration, le gabarit ira chercher l’image de fond de sa face sur le produit qui est lié. Si le produit n’a pas d’image, ce sera l’image par défaut qui sera prise.