Généralement, les gens doivent utiliser un widget d'avatar pour modifier n'importe quelle image comme l'image de profil ou des éléments connexes. Un widget de qualité effectue des tâches qui incluent le placement de l'image d'un utilisateur, la modification et la conception des détails de connexion ou d'enregistrement. Notre nouveau widget avatar personnalisable possède toutes ces fonctions prioritaires. Vous pouvez présenter un site Web plus esthétique à l’aide de ce module et de ce widget.
Ici, nous avons décrit clairement et facilement les étapes d'utilisation du module avatar et du widget. Apprenez le processus ci-dessous.
Comment utiliser la fonctionnalité Avatar #
Il y a trois étapes principales pour utiliser l'outil avatar :
- Module d'activation
- Activation du widget
- Configurer le widget
Étape 1 : Activation du module #
Pour utiliser le widget Avatar, vous devez Activez le module avatar ShopEngine.
Pour activer le module Avatar, accédez à Tableau de bord WordPress > ShopEngine > Modules > Activer l'avatar > Enregistrer les modifications.
Lisez la documentation complète du module ShopEngine Avatar :
Étape 2 : Activation du widget #
Accédez à : Votre tableau de bord -> ShopEngine -> Widgets -> Activer Avatar -> Enregistrer les modifications.
Pour activer le widget ShopEngine WooCommerce Avatar,
- Aller vers Moteur de boutique > Widgets depuis le tableau de bord WordPress.
- Faites défiler jusqu'à la section Mon compte et recherchez le Avatar widget de la liste.
- Activez le widget en basculant le bouton bascule sur SUR.
- Clique sur le SAUVEGARDER LES MODIFICATIONS bouton.
Étape 3 : Ajouter le widget Avatar au modèle de tableau de bord Mon compte #
Le widget Avatar ne fonctionne que sur la page Mon compte.
- Accédez à la section de vos pages WordPress depuis le tableau de bord.
- Ouvrez le Mon compte page en mode visionneuse.
- Passez la souris sur l'option Modifier avec Elementor et cliquez sur Temporaire de mon compte.
Après avoir ouvert le modèle Mon compte en mode éditeur,
Glissez et déposez le widget Avatar dans la conception du modèle.
Création de la page Mon compte #
Si votre compte ne possède pas de page de compte, vous devez en créer une.
Accédez à : Votre tableau de bord > ShopEngine > Modèles de générateur > Ajouter un nouveau > Paramètres du modèle > Entrez le nom > Définir le type de modèle sur le tableau de bord du compte > Sélectionnez un exemple de conception > Modifier avec Elementor.
Voici la documentation pour créer un Tableau de bord du compte avec ShopEngine.
Étape 4 : Configurer le widget Avatar #
Vous pouvez maintenant configurer le widget sous l'onglet Contenu.
- Choisir la Icône de téléchargement qui permet à l'utilisateur de télécharger son avatar.
- Ensemble "Enregistrer le texte du bouton».
- Activer ou désactiver le Afficher la superposition d'images fonctionnalité.
- Choisir la Icône Fermer.
Comment utiliser ces fonctionnalités ? #
- Icône de téléchargement : L'utilisateur peut télécharger son avatar en cliquant sur l'icône. Téléchargez l'icône depuis la bibliothèque d'icônes ou téléchargez votre propre icône SVG.
- Bouton Enregistrer : Pour enregistrer les modifications du côté utilisateur.
- Superposition d'images : Ajoutez une superposition d'image et l'icône de téléchargement apparaît lorsque vous la survolez.
- Icône Fermer : Bouton pour fermer la section. Choisissez une icône de fermeture dans la bibliothèque d'icônes ou téléchargez votre propre SVG.
*Toutes ces fonctionnalités fonctionnent uniquement au niveau du front-end.“
Étape 5 : Personnaliser le style de l'avatar #
Ensuite, vous pouvez personnaliser les designs de l'avatar sous l'onglet Style. Dans le Rubrique Styles, les options d'édition ici sont-
- Emballage- Ensemble alignement et écart de contenu par rapport à l’image.
- Image- Définissez la largeur de l’image en fonction du design.
- Style de contenu- Vous pouvez modifier la couleur, la typographie, le remplissage, etc. pour le nom, le bouton d'enregistrement et l'e-mail.
- Bouton de téléchargement- Apportez les modifications nécessaires au bouton ici.
- Bouton Fermer- Modifiez le bouton de fermeture ici.
Après avoir publié ou mis à jour la page, elle ressemblera et fonctionnera comme ceci en fonction de vos coordonnées dans le front-end
Les paramètres du widget sont une tâche assez simple. Et comme vous l'avez vu, les fonctionnalités sont utiles et se trouvent dans les champs de compte actuels. Alors, utilisez ce nouveau widget pour créer de jolis profils d’utilisateurs.
ShopEngine est livré avec des fonctionnalités étonnantes comme Avatar Widget et plus encore. Obtenez le plugin ShopEngine pour concevoir des sites Web WooCommerce entièrement personnalisables.