Utilisez Clipart quand le client doit choisir une image que vous fournissez. Cela convient aux illustrations, aux logos, aux arrière-plans, aux cadres transparents et aux autres visuels. Vous choisissez les images à proposer ; le client en choisit une dans le customizer.
Utilisez Image pour une image fixe ou un téléversement de photo client. Pour combiner une photo client avec un choix de cadres, ajoutez un calque Image pour le téléversement et un calque Clipart distinct au-dessus pour les cadres.
On le confond facilement avec le panneau Graphismes, alors commençons par là : Graphismes est votre propre bibliothèque, et tout ce sur quoi vous cliquez se place sur le canevas et y reste. Clipart est un champ de personnalisation. Vous choisissez la catégorie ; le client choisit le graphisme.
Avant de commencer : les images se trouvent dans Médiathèque
Un élément Clipart utilise les images d’une catégorie de votre médiathèque. Vous pouvez garder toute la catégorie ou composer une sélection pour cet élément. Une fois la sélection composée, ajouter d’autres fichiers à la catégorie source ne les ajoute pas à cette sélection.
Si vous n’avez encore aucune catégorie, le panneau le dit clairement et vous renvoie vers Médiathèque pour en créer une. Voici ce que voit un nouveau compte :
Construisez d’abord la catégorie dans la médiathèque, puis revenez ici.
Ajouter l’élément
Ouvrir le panneau Clipart
Dans le Design Studio, ouvrez Éléments et cliquez sur la tuile Clipart.
Choisir l'origine de la catégorie
Mes catégories liste les catégories que votre organisation a créées. Bibliothèque liste des catégories prêtes à l’emploi que vous pouvez reprendre : choisissez Ajouter à ma bibliothèque et elle devient la vôtre, à utiliser et à enrichir.
Quand une catégorie de la bibliothèque s’agrandit après que vous l’avez reprise, le panneau propose d’ajouter les nouveaux graphismes au lieu de vous faire tout reconstruire.
Choisir une catégorie
Cliquez sur une catégorie et l’élément arrive sur le canevas en affichant l’un de ses graphismes. Chaque catégorie indique combien de graphismes elle contient : une catégorie vide se repère donc avant de l’utiliser.
Choisir les images à proposer
Sélectionnez l’élément Clipart. Sous Contenu, dans l’onglet Design, son ensemble s’affiche en tuiles carrées, quatre par rangée. Cliquez sur la tuile plus, Ajouter des images, pour ouvrir la catégorie déjà utilisée par cet élément.
Déposez des fichiers dans la zone de téléversement pour les ajouter directement à cette catégorie et à cet élément. Ou cliquez sur Ajouter des images dans la zone pour ouvrir le sélecteur de médias standard, qui démarre dans la catégorie actuelle. Téléversez de nouveaux fichiers, sélectionnez des images existantes et modifiez leurs titres dans le panneau de détails. Les images déjà proposées par cet élément affichent un badge coché Déjà ajouté et ne peuvent pas être sélectionnées de nouveau. Seules les nouvelles sélections comptent pour Ajouter des images. Confirmez avec Ajouter des images.
Les téléversements vont toujours dans cette catégorie de clipart, même si vous parcourez un autre dossier dans le sélecteur. Sélectionner une image existante d’un autre dossier ajoute une copie à la catégorie sans déplacer l’original. Sélectionner de nouveau la même image n’ajoute pas une autre copie. Les téléversements restent dans la médiathèque même si vous annulez le sélecteur.
Supprimer un fichier via le sélecteur le retire de la médiathèque après confirmation ; les fichiers utilisés par des créations sont protégés. Retirer un choix dans l’éditeur ne le retire que de cet élément.
Les tuiles s’affichent sur deux rangées à la fois ; dans un ensemble plus grand, Toutes montre le reste. Une étoile marque l’image par défaut. La ligne sous les tuiles compte les images et se termine par Gérer l’ensemble.
Choisissez Gérer l’ensemble pour ouvrir le gestionnaire. Cherchez par nom ou utilisez les flèches de page pour trouver un choix. Modifiez un nom directement dans sa ligne ; appuyez sur Entrée ou quittez le champ pour l’appliquer. Changez un numéro de position pour réordonner une image, définissez le Prix de chaque image, choisissez une valeur par défaut avec l’étoile, ou sélectionnez plusieurs images et utilisez Retirer des choix. Un prix est le supplément de l’image dans votre médiathèque : il s’applique donc partout où cette image est utilisée. Gardez au moins une image. Annuler la suppression rétablit le retrait le plus récent tant que le gestionnaire est ouvert. Appliquer les modifications applique le brouillon en une fois ; Annuler l’abandonne. Renommer, réordonner et retirer nécessitent que le champ soit activé dans l’onglet Personnaliser ; sinon, le gestionnaire permet seulement de chercher dans l’ensemble et de choisir la valeur par défaut.
Retirer un choix n’affecte que cet élément ; l’original reste dans votre médiathèque. Les noms et l’ordre ne s’appliquent eux aussi qu’à cet élément et ne renomment aucun fichier ni ne modifient d’autres créations. Si vous retirez l’image par défaut, la première image restante devient la valeur par défaut.
Pour utiliser une autre catégorie, ouvrez Ajouter des images et choisissez Changer de catégorie. Appliquer des images d’une autre catégorie remplace la sélection de cet élément et définit une valeur par défaut valide à partir des nouvelles images.
Proposer l’absence d’image
Dans l’onglet Personnaliser, activez Aucune image sous Ce que les clients peuvent modifier pour permettre aux clients de laisser ce calque vide. Définissez son Nom du choix vide, par exemple « Sans cadre », et activez Commencer sans image si le calque doit démarrer vide.
Sélectionner cette option masque seulement le visuel de ce calque. Une photo client distincte reste en place. Aucun supplément de visuel ni de champ n’est ajouté pour ce choix vide. Il compte comme une réponse valide quand le champ est obligatoire.
Utilisez des visuels aux dimensions identiques et à fond transparent quand ils doivent se placer au-dessus d’une photo. Chaque choix remplace l’image à la même position et à la même taille dans le même calque Clipart.
Définir ce que voient d’abord les clients
L’image marquée d’une étoile, dans les tuiles de l’ensemble sous Contenu, est celle qui apparaît avant que le client touche quoi que ce soit : sur votre canevas, dans l’aperçu du produit, et dans le panier s’il ne change rien. Cliquez sur la tuile de l’image qui vend le produit en miniature, et l’étoile s’y déplace. Pour ouvrir plutôt avec le calque vide, activez Commencer sans image, qui apparaît dès que Aucune image est activé.
Pour les éléments existants qui utilisent encore toute une catégorie, la catégorie reste la source des images disponibles.
Choisir l’aspect du sélecteur
Ce que voient les clients, dans l’onglet Personnaliser, définit la disposition du sélecteur dans votre boutique. Il y en a six, et la bonne dépend de la manière dont les gens reconnaissent vos visuels : à vue ou par leur nom.
Choisissez une tuile visuelle pour changer la disposition. Chaque tuile montre un petit exemple de disposition et un nom court, et la tuile sélectionnée est marquée. Le (i) de la section nomme la disposition sélectionnée et ce à quoi elle convient. Les exemples illustrent la disposition, pas vos visuels réels. Vos choix existants et la valeur par défaut restent les mêmes quand vous changez de disposition.
| Tuile | Disposition | Idéal pour |
|---|---|---|
| Avec noms | Grille de miniatures | Des visuels que les clients reconnaissent à vue, comme des races de chiens ou des signes du zodiaque |
| Image + nom | Liste avec miniatures | Quand les noms et les images comptent autant, comme des écussons d’équipes |
| Liste de noms | Liste de noms | Les longues listes aux noms clairs, où quarante miniatures formeraient un mur |
| Compact | Miniatures compactes | De petites images sans légende ; le nom apparaît au survol ou au focus clavier et reste visible pour le choix sélectionné sur les écrans tactiles |
| Menu déroulant | Liste déroulante | Un sélecteur compact montrant une petite image, le nom et le supplément éventuel de chaque choix |
| Boutons | Boutons | Une poignée de choix avec une petite image à côté de chaque nom |
Les boutons et la liste déroulante affichent un petit aperçu à côté de chaque nom, y compris pour le choix actuellement sélectionné dans la liste déroulante. Le choix vide utilise une icône d’absence d’image. Ouvrez la liste déroulante avec Entrée ou Espace, parcourez-la avec les touches fléchées (ou saisissez le début d’un nom), sélectionnez avec Entrée, et fermez sans changer la sélection avec Échap.
Une grille de quarante miniatures sur un téléphone, cela fait beaucoup de défilement. Si votre catégorie est longue et que les noms sont sans ambiguïté, une liste de noms ou une liste déroulante occupe moins de place.
Les deux dispositions en liste restent ouvertes, avec des lignes espacées et des noms qui passent à la ligne. La liste déroulante s’ouvre à la demande. Les créations existantes gardent leur disposition actuelle. Les miniatures compactes préservent les proportions complètes du visuel ; une image cassée affiche quand même son nom. Le choix vide facultatif utilise une tuile à icône seule de même taille, avec son nom disponible au survol, au focus et à la sélection.
Laisser les clients recolorer leur choix
Recolorer, sous Ce que les clients peuvent modifier dans l’onglet Personnaliser, ajoute des contrôles de couleur au sélecteur, pour que le client puisse changer les couleurs du graphisme qu’il a choisi.
Cela ne fonctionne que sur les graphismes qui ont des couleurs distinctes à modifier, c’est-à-dire en pratique les visuels SVG. Son (i) vous indique combien de graphismes de la catégorie sont concernés : une catégorie où seule la moitié est recolorable se repère donc avant que vous le promettiez. Si aucun ne l’est, l’interrupteur est indisponible et son (i) en donne la raison : une photo ou une image à plat n’a pas de couleurs distinctes.
Facturer plus cher les graphismes qui coûtent plus
Supplément définit un montant supplémentaire pour un graphisme précis. Utilisez-le quand une option vous coûte réellement plus, comme un motif avec davantage de couleurs d’impression ou un motif sous licence à l’usage.
Il se définit par graphisme, pas par catégorie : la plupart de vos visuels peuvent donc rester au prix de base pendant que deux ou trois coûtent plus. Le montant s’ajoute à tout supplément déjà défini pour l’ensemble du champ, y compris un supplément en pourcentage. Un champ avec un supplément de 10 % et un graphisme avec un supplément fixe facture les deux.
Importer beaucoup de visuels d’un coup
Ouvrez Importer un ZIP sous la liste des catégories, choisissez la catégorie de destination, puis choisissez votre fichier ZIP. L’import est une action groupée facultative ; les catégories existantes n’ont pas besoin d’être téléversées de nouveau. Pour des images individuelles, ouvrez Ajouter des images et déposez des fichiers dans la zone de téléversement, ou utilisez son bouton Ajouter des images pour ouvrir le sélecteur de médias. Les fichiers non pris en charge ou trop volumineux d’un ZIP sont ignorés au lieu de faire échouer tout l’import, et le résultat vous indique combien sont entrés et combien ont été écartés.
Les miniatures de catégorie affichent l’image par défaut marquée d’une étoile d’un élément Clipart de la face de création actuelle. Si plusieurs éléments utilisent cette catégorie, l’élément sélectionné est prioritaire. Cela ne modifie ni la bibliothèque partagée ni les autres créations. Les catégories sans valeur par défaut d’élément utilisent leur couverture ou leur première image disponible ; les catégories vides affichent une icône de dossier.
Suite
Pour choisir vous-même le graphisme au lieu de laisser le client choisir, utilisez le panneau Graphismes. Pour définir où ce champ apparaît dans le formulaire du client, consultez la mise en page du customizer et l’ordre des champs.