La plupart des liens texte font une chose sur le vol stationnaire : changer de couleur Le Widget Liens créatifs Elementor de Master Addons vous donne beaucoup plus à jouer avec : des crochets qui glissent autour des mots, un remplissage qui balaie le texte, un retournement 3 D (Pro), et 22 effets de survol au total vous pouvez déposer sur n'importe quel lien sans ouvrir un fichier CSS.
Ci-dessous, nous allons ajouter le widget, passer par chaque contrôle de Contenu, couvrir les options Style, et courir vers le bas de la liste d'effet Les captures d'écran de l'éditeur viennent à chaque étape Tout d'abord, voici où le widget se trouve dans le panneau.
Ce que fait le widget Creative Links #
Il prend un lien simple en ligne et le fait bouger. Le Widget Boutons Créatifs stylise un bouton solide et rembourré Creative Links est la version text-link : une “Lire plus de”, un appel à l'action de style nav, ou une seule phrase que vous voulez ressortir à l'intérieur d'une phrase L'animation se déclenche en vol stationnaire, et vous la choisissez parmi une seule liste déroulante.
Vous obtenez également une icône optionnelle, une étiquette alternative que certains effets révèlent, des contrôles d'alignement et un onglet Style avec typographie, bordure et un ensemble d'options de couleurs construites autour des animations de lien. C'est dans le plugin gratuit Master Addons avec 10 effets, et Master Addons Pro déverrouille les 12 autres. Le complet widgets et extensions la liste contient le reste.
Voyez-le plutôt avant de lire chaque paramètre ? voici le widget en action.
Avant de commencer #
- WordPress avec Élémenteur installé et actif.
- Modules complémentaires principaux pour Elementor installé et actif. Nouveau à lui ? Commencez par le guide d'installation.
- Une page ou un modèle ouvert dans l'éditeur Elementor.
Comment ajouter le widget Creative Links #
Cette partie est rapide :
- Ouvrez une page avec Elementor et cliquez sur l'icône du panneau de widget (la grille) en haut à gauche.
- Type Liens Créatifs dans le champ de recherche, ou faites défiler vers le bas Additions maîtres catégorie.
- Faites glisser le Liens Créatifs widget sur la toile.
Il atterrit avec l'espace réservé “Click Here” text, prêt à être modifié.
Paramètres du contenu expliqués #
Sélectionnez le lien et ouvrez le Contenu onglet. C'est ici que vous définissez le texte, l'effet et où pointe le lien.
Effets #
Le Effets dropdown est toute la raison d'utiliser ce widget Choisissez-en un et le lien s'anime en vol stationnaire La liste comporte 22 options Dix sont gratuits et douze ont besoin de Pro :
Gratuit: Supports, diapositive de la ligne inférieure, bordure inférieure agrandie, 2e diapositive de bordure vers le haut, remplissage de texte, trois points, réduction, déplacement vers le haut, effet 21 et effet 22.
Pro : Effet 3 D, Glisser vers l'intérieur, Border Slide Down, Border Translate, 2nd Text and Border, Révéler Push Out, Cercle, Interrupteur de frontière, Chute vers le bas, Croix, Glissière 3 D, et Glisser vers le bas 3 D.
Les noms ne donnent pas grand-chose, alors passez le lien dans l'aperçu en direct pour voir ce que chacun fait Les supports et le remplissage de texte fonctionnent bien dans la copie corporelle Les options 3 D (Pro) sont des titres plus bruyants et plus adaptés ou un lien héros.
Alignement des éléments, alignement des liens et alignement du texte arrière #
Alignement d'éléments positionne l'ensemble du widget (Gauche, Centre, Droite). Alignement des liens et Alignement du texte arrière gérez le texte du lien et l'étiquette alternative apportée par certains effets. Tous les trois sont réactifs, vous pouvez donc les définir par appareil avec la bascule.
Texte de lien et texte de lien alternatif #
Le Lien Texte est l'étiquette visible, disons “Click Here” Le Texte de lien alternatif (“Go !” dans les captures d'écran) est le deuxième label qui se remplace sur Reveal Push Out, Move Up, Cross, 3 D Slide, et 3 D Slide Down Gardez-le court, puisqu'il n'obtient que l'espace que l'animation laisse derrière elle.
Espacement des icônes et des icônes #
Vous pouvez installer une icône à côté du texte, puis définir l'écart avec Espacement des icônes. Master Addons regroupe huit primes bibliothèques d'icônes« , donc il y a beaucoup à choisir juste à l'intérieur d'Elementor ».
URL du lien #
Déposez la destination URL du lien. L'icône d'engrenage à côté contient les options habituelles : ouvrir dans un nouvel onglet, ajouter nofollow Pour un lien sur site, collez n'importe quelle page de votre propre site.
Paramètres de style expliqués #
Passer au Style onglet et ouvrez Styles de liens. Voici à quoi ressemble le lien avant et après l'animation.
- Largeur et Taille de l'icône: taillez la boîte de liens et l'icône par eux-mêmes.
- Typographie: famille de polices, taille, poids et espacement des lettres pour l'étiquette.
- Rembourrage de liens: espacement à l'intérieur de la zone de lien Cela donne également une certaine marge d'effets à animer.
- Type de bordure, largeur, couleur et rayon: une bordure autour de la boîte de lien Les lignes mobiles dans des effets comme Bottom Line Slide proviennent des couleurs BG Avant et Après, pas de cette bordure.
- Ombre de boîte: profondeur sur la boîte de lien si vous le souhaitez.
Couleurs normales et Hover #
Les commandes de couleur se divisent en Normal et Survole états. Aux côtés de l’habituel Couleur du texte et Couleur d'arrière-plan, vous verrez Couleur BG avant, Avant BG Color, et Après BG Color. Ces couches supplémentaires sont ce entre quoi les effets de diapositive et de remplissage s'animent, alors définissez-les lorsque vous souhaitez contrôler la couleur qui apparaît à mi-animation.
Voir un effet en action #
Voici l'effet Brackets sur la toile Passez le lien et un crochet glisse de chaque côté, donc “Click Here” se lit comme “ [Click Here]” Chaque effet se comporte ainsi dans l'aperçu en direct, ce qui facilite l'essai de quelques-uns avant de vous engager.
Conseils pour utiliser Creative Links #
- Faites correspondre l'effet au spot. Les subtils comme Text Fill ou Bottom Line Slide se trouvent bien dans les paragraphes Enregistrer Slide et Cross 3 D (tous deux Pro) pour les titres et les zones de héros.
- Regardez les couleurs BG. Les arrière-plans avant, avant et après peuvent effacer votre texte en milieu d'animation, alors vérifiez que le lien reste lisible tout au long de l'effet.
- Gardez l'étiquette alternative courte. Un long texte de lien alternatif est exigu dans l’espace laissé par l’animation.
- N'oubliez pas le toucher. Hover ne tire pas sur un téléphone, donc l'état de repos doit avoir l'air terminé tout seul.
Besoin d'un bouton plein solide au lieu d'un lien texte ? c'est le Widget Boutons Créatifs. Vous voulez un titre, une description et un bouton ensemble ? Regardez le Widget Appel à l'action.
Foire aux questions #
Qu'est-ce que le widget Elementor Creative Links ?
C'est un widget Master Addons qui ajoute des liens de texte animé à Elementor Au lieu d'un changement de couleur simple, les liens obtiennent des effets de survol comme Brackets, Text Fill, et (avec Pro) Circle et 3 D Slide, le tout défini à partir d'un dropdown sans CSS personnalisé.
Combien d'effets de lien sont inclus ?
Le widget a 22 effets Dix sont gratuits, y compris les Brackets, Bottom Line Slide, Text Fill, Three Dots, et Move Up. Douze ont besoin de Pro, y compris Effet 3 D, Glisser In, Cercle, Commutateur de bordure, Croix, et Glissière 3 D. Vous prévisualisez chacun en direct dans l'éditeur Elementor avant de publier.
Le widget Creative Links est-il gratuit ?
Oui. Creative Links fait partie du plugin gratuit Master Addons for Elementor avec 10 effets Master Addons Pro ajoute les 12 autres effets Voir le page de tarification pour la comparaison complète.
Quelle est la différence entre Creative Links et Creative Buttons ?
Creative Links anime des liens texte en ligne, comme une “Lire plus de” ou une phrase dans une phrase Les boutons créatifs stylisent un bouton solide et rembourré Choisissez Liens pour les appels à l'action de style texte et Boutons pour ceux de style bloc.
Les effets de survol de liaison fonctionnent-ils sur mobile ?
Les effets de survol ont besoin d'une souris, ils ne se déclenchent donc pas sur les écrans tactiles Concevez l'état de repos pour avoir l'air complet, et le lien fonctionne toujours et se lit bien sur les téléphones et les tablettes.
Envelopper #
Le Widget Liens créatifs Elementor donne à vos liens texte un mouvement : 22 effets de survol (10 gratuits), une icône et des commandes de couleurs pour les calques d'animation, sans code Choisissez un effet, définissez les couleurs et vos liens s'arrêtent juste là. D'ici, le reste du Bibliothèque de widgets Master Addons vaut le coup d'oeil.
