Créez vos propres widgets d'élément. Aucun code requis.
Rencontrez Widget par Master Addons Builder un puissant pont entre votre code personnalisé et l'éditeur Elementor Transformez des conceptions uniques, des interfaces générées par l'IA ou des extraits interactifs de code Pen en widgets Elementor entièrement fonctionnels et réutilisables.
L'avantage du constructeur de widgets
Créer des Widgets Vraiment Uniques
Créez des widgets selon les besoins exacts de votre projet - ce que les bibliothèques prédéfinies ne peuvent pas offrir.
Donnez vie aux conceptions AI et CodePen
Intégrez directement des interfaces utilisateur personnalisées à partir d'outils d'IA ou de prototypes en direct de CodePen dans votre site en tant que widgets Elementor modifiables.
Contrôle créatif complet
Vous possédez la pile entière : structure (HTML), style (CSS) et interactivité (JS), ainsi que la possibilité d'ajouter des bibliothèques externes.
Réutiliser et gagner du temps
Créez un widget une fois, enregistrez-le dans votre bibliothèque et réutilisez-le sur n'importe quel projet avec des paramètres cohérents et modifiables.
Conçu pour les utilisateurs expérimentés
Si vous connaissez Elementor, vous pouvez utiliser Widget Builder L'interface familière basée sur les onglets rend la création de widgets visuelle et intuitive.
Widgets personnalisés sur n’importe quel site
Construisez un widget une fois et exportez/importez-le facilement pour l'utiliser sur des sites Web WordPress complètement différents, ce qui permet de gagner énormément de temps
Créez et nommez votre widget
Commencez par établir l'identité de votre nouveau composant Donnez-lui un titre clair et organisez-le au sein d'une catégorie pour un accès transparent à chaque fois que vous utilisez Elementor.
- Attribuez un titre unique et descriptif à votre widget.
- Catégorisez-le pour un accès futur facile dans le panneau de l'éditeur.
- Configurez les bases de base de votre élément réutilisable.
Concevoir l'expérience de l'éditeur
Construisez l'interface avec laquelle vos utilisateurs interagiront En ajoutant des commandes comme des basculements et des sélecteurs de couleurs, vous construisez visuellement le panneau de paramètres du widget sans écrire de code.
- Ajouter des contrôles (texte, couleur, sélectionner) dans le panneau de gauche.
- Chaque contrôle devient une option modifiable dans Elementor.
- Concevez visuellement l'ensemble du panneau de paramètres orienté utilisateur.
Mappez les contrôles sur votre code
C'est là que votre widget devient dynamique Le constructeur génère des shortcodes intelligents pour chaque contrôle, que vous placez dans vos modèles pour créer des liens en direct entre les paramètres et la sortie.
- Utilisez des shortcodes générés automatiquement comme {{color}}.
- Collez-les dans votre code HTML, CSS ou JS.
- Créez un lien direct entre les entrées de l'éditeur et l'affichage frontal.
Enregistrer et utiliser n'importe où
Une fois enregistré, votre widget personnalisé est prêt à l'action Il apparaît dans l'éditeur Elementor, prêt à être glissé dans n'importe quelle page et personnalisé avec les paramètres en direct que vous avez construits.
- Enregistrez pour l'ajouter instantanément à votre panneau Élémenteur.
- Faites glisser et déposez le widget sur n'importe quelle page.
- Ajustez les paramètres en direct et voyez le rendu de conception instantanément.
Widgets prêts à l'emploi
Douze mises en page Pro et huit gratuites Importez le JSON, modifiez dans Elementor.
Que pouvez-vous réellement construire ?
De l'IA au site Web
Générez une carte de prix complexe ou un curseur de témoignage avec un outil de conception d'IA, copiez le code et branchez-le sur Widget Builder C'est maintenant un widget Elementor gérable avec du texte et des couleurs modifiables.
CodePen à la production
Trouvé un superbe bouton animé ou une galerie unique sur CodePen ? ne vous contentez pas de l'intégrer - transformez-le en un widget natif où vous pouvez contrôler tous les paramètres.
Construisez votre propre kit d'interface utilisateur
Créez une suite de boutons, d'en-têtes ou de cartes d'information personnalisés avec les modèles d'interaction uniques de votre marque et réutilisez-les sur tous les sites clients.
Options disponibles
Texte
Ajouter une entrée de texte de base.
Valeurs numériques d'entrée uniquement.
Pour les entrées de texte plus longues.
Éditeur de texte visuel riche.
Snippets de code d'entrée directement.
Stockez les données d'arrière-plan cachées.
Activer/désactiver une option.
Ouvrez les paramètres avancés popover.
Choisissez parmi les options de dépôt.
Choisissez n'importe quelle couleur visuellement.
Sélectionnez une famille de polices.
Contrôlez tout le style du texte.
Choisissez une date/heure.
Saisir ou sélectionner des liens.
Téléchargez ou sélectionnez un média.
Sélectionnez plusieurs images ensemble.
Choisissez parmi la bibliothèque d'icônes.
Ajustez les valeurs avec le curseur.
Définir le rembourrage, la marge, etc.
Appliquer visuellement les effets d'ombre.
Définir les propriétés de fond de l'élément.
Sélectionnez parmi les options d'image.
Créer des groupes de contenu répétitifs.
Organiser le contenu en onglets.
Ajoutez des options de couleur dans votre widget.