[FR] Manuel Image Designer

Guide d'installation du module Image Designer (Prestashop)

Configuration du produit

1. Créer un nouveau produit
   Créer un nouveau produit Prestashop qui acceuillera le module.
   
   
2. Activer le module
   

   Pour cela définissez les 3 caractéristiques suivantes sur le produit :

   • Configurateurvisuel : TD
   • CustomZones : ON
   • CVHTML5 : ID

   Si une des caractéristiques n'existe pas, créez la avec sa valeur en respectant l'orthographe et la casse des caractères.

   
   
   
3. Ajouter la combinaison designer-ref
   Dans l'onglet Déclinaison de la fiche produit, utilisez le générateur de déclinaisons pour ajouter la déclinaison obligatoire : designer-ref : DEFAULT.
   N'ajoutez aucune autre déclinaison.
   A chaque ajout au panier, une nouvelle déclinaison sera créé : il s'agit de la référence de commande unique. C'est donc toutafait normal.
   
   
4. Images produit 
   Enfin, vous devez paramétrer le visuel du produit : ouvrez l'onglet Images du produit.
   
   La première image  doit représenter l'image de couverture du produit. Vous pouvez ajouter une image de votre choix . Cette image sera affichée dans les pages de catégorie et panier de votre site internet.
   La seconde image sera l'image de fond affichée dans le module. Elle doit mesurer au minimum 600x600 px et son format doit etre carré.
   

   Après avoir uploadé la seconde image , cliquez sur l'icone + située dans la colonne Zone pour accéder à l'espace de configuration.

   Dessinez une zone correspondant au contour du produit. Soyez assez précis : cette zone definiera le ratio hauteur/largeur utilisé pour calculer la surface d'impression et donc le prix.

   
   Puis sélectionnez  'Mask' en tant que type de zone
   Chosissez le fichier masque .png transparent. Ce fichier que vous aurez créé, doit etre opaque autour des contours du produits, et transparent à l'intérieur.
   Il doit mesurer exactement la même taille que l'image de fond. 
   
   Une fois configuré,ajoutez ou mettez à jour la zone, attendez que la page soit chargée et enregistrer .
   
   

Votre produit est maintenant configuré !

Ajouter couleurs et textures

Le module utilise des images .jpg pour afficher et ajouter des couleurs ou des textures.

Vous pouvez créer des dossiers images ou textures dans le dossier : /modules/cvtextdesigner/lib/jquery-configurateurvisuel/img/userlib/

Par exemple : /www/modules/cvtextdesigner/lib/jquery-configurateurvisuel/img/userlib/vinyl unis/

Pour chaque dossier, vous devez définir un prix au m², qui sera celui de cette catégorie de support d'impression ou de découpe.

Définir les prix au m² des catégories de couleurs et textures

Editez le fichier .json : /modules/cvtextdesigner/lib/jquery-configurateurvisuel/js/static.json

Pour chaque dossier, vous devez inserer une ligne tel que :

"texturesPrices": [
      {
        "folder": "vinyl unis",
        "price": "150"
      },
       {
        "folder": "Tissus Liberty",
        "price": "50"
      },
       {
        "folder": "Tissus lin",
        "price": "500"
      },
       {
        "folder": "Tissus unis",
        "price": "70"
      }
    ]

Dans cet exemple, toutes les couelurs du dossier "vinyl unis", auront un prix de 150,00 € HT du m².

Prix minimum

Vous pouvez définir un prix minimum pour vos produits dans le fichier static.json à la ligne contenant pMin :

"pMin": "3.33",

Hauteur minimum et maximum

Vous pouvez définir une hauteur maximum pour chaque ligne dans le fichier static.json à les lignes contenant heightMin et heightMax :

"heightMin": "3",

"heightMax": "250",

Traductions

Les traductions s'effectuent dans le backoffice, via l'onglet localisation.

Selectionnez le champs 'modules installés' de l'onglet Traductions, puis soit les traductions du thème ou core.

Il y a un fichier de traduction additionnel pour votre langue situé dans  /modules/cvtextdesigner/lib/jquery-configurateurvisuel/i18n/

Vouvez l'editer avec un editeur de texte.