Widget de bouton animé Elementor avec effets de survol créatifs
Creative Button est un widget gratuit Master Addons pour les boutons d'appel à l'action avec une animation de survol intégrée Choisissez un effet dans la liste Effets de bouton, tapez le texte et un deuxième message en option pour le survol, ajoutez une icône et stylisez les couleurs normales et de vol stationnaire Le plugin gratuit comprend 6 effets : Par défaut, Winona, Ujarak, Wayra, Tamaya et Rayen. Maître Addons Pro ajoute 15 de plus, de Pipaluk à Shikoba, pour 21 au total.
Comment ajouter un bouton animé dans Elementor
Vous avez besoin d'Elementor et du plugin gratuit Master Addons de WordPress.org.
- Vérifiez que le bouton créatif est activé ci-dessous Additions maîtresses, widgets.
- Dans l'éditeur Elementor, recherchez Bouton Créatif et faites-le glisser sur la page.
- Choisissez un effet dans Effets de bouton et passez le bouton pour le prévisualiser.
- Tapez le texte du bouton, le texte du bouton alternatif et l'URL du lien.
- Ajoutez une icône et choisissez Avant ou Après.
- Dans l'onglet Style, définissez le remplissage, le rayon de bordure et les différentes couleurs Normal et Hover pour que l'animation soit facile à voir.
Pour une procédure pas à pas plus longue avec des extensions telles que des info-bulles et des animations révélatrices, lisez Comment créer des boutons animés Elementor. Chaque paramètre est dans le Paramètres du widget Creative Button.
21 effets de survol : 6 gratuits, 15 avec Pro
Chaque nom dans Effets de bouton est une animation de survol CSS différente, comme un arrière-plan qui glisse, une bordure qui dessine autour du bouton ou du texte qui passe à un deuxième message Par défaut, Winona, Ujarak, Wayra, Tamaya et Rayen sont libres Pipaluk, Moema, Isi, Aylen, Saqui, Wapasha, Nina, Nanuk, Nuka, Antiman, Itzel, Naira, Quidel, Sacnite et Shikoba ont besoin de Pro. Passez le bouton sur la toile pour prévisualiser chacun d'eux.
- Alignement des boutons et alignement du texte des boutons, définis par appareil.
- Couleurs d'arrière-plan supplémentaires avant et après pour les effets utilisant des arrière-plans superposés.
- La vitesse d'animation est fixée par chaque effet Il n'y a pas de réglage de la durée de transition.
Texte de bouton, texte alternatif, icône et style
Définir le Texte du bouton et un URL du lien avec les options habituelles de nouvel onglet et de non-suivre Chaque effet sauf Par défaut affiche un Texte de bouton alternatif champ pour le message de survol Ajouter un Icône avant ou après le texte avec Icon Spacing. Dans Styles de boutons(en anglais), définissez la largeur, la typographie, le remplissage de boutons, la bordure, le rayon de bordure, l'ombre de boîte et la taille de l'icône, puis choisissez les couleurs du texte, de l'arrière-plan et de l'icône pour Normal
- “Démarrez” qui change en “C's free” on hover.
- Une icône de flèche après le texte pour afficher la direction.
- Boutons de pilules arrondis avec une bordure qui change de couleur en vol stationnaire.
Bouton Élémenteur vs Bouton Créatif Additions Maître
Le widget gratuit Elementor Button a déjà des animations de survol Voici où chacune d'elles s'adapte.
| Caractéristique | Bouton Élémenteur | Bouton créatif des modules complémentaires principaux |
|---|---|---|
| Prix | Gratuit en Elementor | 6 effets gratuits, 21 avec Pro |
| Animation de survol | Liste d'animation Elementor Hover, telle que Grow, Pulse, Bob et Wobble | Effets CSS nommés avec arrière-plans coulissants, bordures et couleurs superposées |
| Échange de texte en vol stationnaire | Non | Texte de bouton alternatif |
| Contexte | Classique ou dégradé pour Normal et Hover | Couleurs unies, plus couleurs Avant et Après sur certains effets |
| Vitesse de transition | Transition Durée paramètre | Fixé par chaque effet |
| Icône | Avant ou après, avec espacement | Avant ou après, avec espacement, taille et couleur de vol stationnaire |
Utilisez le bouton Élémenteur pour les dégradés, une vitesse de transition personnalisée ou une simple croissance ou impulsion Utilisez le bouton créatif lorsque vous souhaitez un balayage d'arrière-plan ou un échange de texte sans CSS personnalisé. Pour les liens de texte animé, voir Liens Créatifs.
Foire aux questions pour le bouton créatif
Le widget Creative Button est-il gratuit ?
Oui. Le widget et 6 effets (Default, Winona, Ujarak, Wayra, Tamaya et Rayen) sont gratuits Les 15 autres effets sont nécessaires Maître Addons Pro.
Puis-je l'utiliser comme bouton de soumission de formulaire ?
No. Creative Button est un lien, pas un bouton de formulaire Pour styliser un bouton de soumission, utilisez le widget de formulaire pour votre plugin, tel que le Formulaire de contact 7 ou Formulaires WP widget.
Les effets de survol fonctionnent-ils sur les téléphones ?
Les écrans tactiles n'ont pas de vol stationnaire, de sorte que la plupart des visiteurs sur les téléphones voient l'état normal et vont directement au lien Assurez-vous que les couleurs normales et le texte fonctionnent d'eux-mêmes.
Puis-je changer la vitesse de l'animation du vol stationnaire ?
Pas dans le panneau Chaque effet a son propre timing Vous pouvez le changer avec CSS personnalisé sur le bouton, ou utiliser le widget Bouton Élémenteur, qui a un paramètre Durée de transition.
En quoi est-ce différent de l'animation de survol du bouton Élémenteur ?
Le bouton Élémenteur déplace l'ensemble du bouton, par exemple croître ou pulser. Les effets de bouton créatif animent l'intérieur du bouton, comme un arrière-plan glissant ou le texte passant à votre texte de bouton alternatif.
Widgets et extensions d'éléments tendance
Construisez des sites Web sophistiqués en moins de temps.
Glassmorphisme
Extras de conteneurs
Modèles
![Modules principaux Extension de duplicateur de messages/pages pour le lien de ligne Elementor : MA Duplicator dans la liste des pages WordPress créant une ébauche de page de destination - [Dupliqué n° 128]](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Duplicateur de messages/pages
