Most text links do one thing on hover: change color. The Elementor Creative Links widget from Master Addons gives you a lot more to play with: brackets that slide in around the words, a fill that sweeps across the text, a 3D flip (Pro), and 22 hover effects in total you can drop on any link without opening a CSS file.
Below, we’ll add the widget, go through every Content control, cover the Style options, and run down the effect list. Screenshots from the editor come with each step. First, here’s where the widget sits in the panel.
What the Creative Links widget does #
It takes a plain inline link and makes it move. The Creative Buttons widget styles a solid, padded button. Creative Links is the text-link version: a “Read more”, a nav-style call to action, or a single phrase you want to stand out inside a sentence. The animation fires on hover, and you choose it from one dropdown.
You also get an optional icon, an alternate label that some effects reveal, alignment controls, and a Style tab with typography, border, and a set of color options built around the link animations. It’s in the free Master Addons plugin with 10 effects, and Master Addons Pro unlocks the other 12. The full widgets and extensions list has the rest.
Rather see it before reading every setting? Here’s the widget in action.
Before you start #
- WordPress with Elementor installed and active.
- Master Addons for Elementor installed and active. New to it? Start with the installation guide.
- A page or template open in the Elementor editor.
How to add the Creative Links widget #
This part is quick:
- Open a page with Elementor and click the widget panel icon (the grid) in the top-left.
- Type Creative Links in the search box, or scroll down to the Master Addons category.
- Drag the Creative Links widget onto the canvas.
It lands with placeholder “Click Here” text, ready for you to edit.
Content settings explained #
Select the link and open the Content tab. This is where you set the text, the effect, and where the link points.
Effects #
The Effects dropdown is the whole reason to use this widget. Pick one and the link animates on hover. The list has 22 options. Ten are free and twelve need Pro:
Free: Brackets, Bottom Line Slide, Bottom Border Enlarge, 2nd Border Slide Up, Text Fill, Three Dots, Scale Down, Move Up, Effect 21, and Effect 22.
Pro: 3D Effect, Slide In, Border Slide Down, Border Translate, 2nd Text and Border, Reveal Push Out, Circle, Border Switch, Fall Down, Cross, 3D Slide, and 3D Slide Down.
The names don’t give much away, so hover the link in the live preview to see what each one does. Brackets and Text Fill work well in body copy. The 3D options (Pro) are louder and fit headings or a hero link.
Item Alignment, Link Alignment, and Back Text Alignment #
Item Alignment positions the whole widget (Left, Center, Right). Link Alignment and Back Text Alignment handle the link text and the alternate label that some effects bring in. All three are responsive, so you can set them per device with the toggle.
Link Text and Alternative Link Text #
The Link Text is the visible label, say “Click Here”. The Alternative Link Text (“Go!” in the screenshots) is the second label that swaps in on Reveal Push Out, Move Up, Cross, 3D Slide, and 3D Slide Down. Keep it short, since it only gets the space the animation leaves behind.
Icon and Icon Spacing #
You can sit an icon next to the text, then set the gap with Icon Spacing. Master Addons bundles eight premium icon libraries, so there’s plenty to pick from right inside Elementor.
Link URL #
Drop the destination in Link URL. The gear icon next to it holds the usual options: open in a new tab, add nofollow. For an on-site link, paste any page from your own site.
Style settings explained #
Switch to the Style tab and open Link Styles. This is how the link looks before and after the animation.
- Width and Icon Size: size the link box and the icon on their own.
- Typography: font family, size, weight, and letter spacing for the label.
- Link Padding: spacing inside the link area. It also gives some effects room to animate.
- Border Type, Width, Color, and Radius: a border around the link box. The moving lines in effects like Bottom Line Slide come from the Before and After BG colors, not from this border.
- Box Shadow: depth on the link box if you want it.
Normal and Hover colors #
The color controls split into Normal and Hover states. Alongside the usual Text Color and Background Color, you’ll see Front BG Color, Before BG Color, and After BG Color. Those extra layers are what the slide and fill effects animate between, so set them when you want to control the color that shows mid-animation.
Seeing an effect in action #
Here’s the Brackets effect on the canvas. Hover the link and a bracket slides in on each side, so “Click Here” reads as “[ Click Here ]”. Every effect behaves like this in the live preview, which makes it easy to try a few before you commit.
Tips for using Creative Links #
- Match the effect to the spot. Subtle ones like Text Fill or Bottom Line Slide sit well in paragraphs. Save 3D Slide and Cross (both Pro) for headings and hero areas.
- Watch the BG colors. Front, Before, and After backgrounds can wash out your text mid-animation, so check the link stays readable through the whole effect.
- Keep the alternate label short. A long Alternative Link Text gets cramped in the space the animation leaves.
- Don’t forget touch. Hover doesn’t fire on a phone, so the resting state has to look finished on its own.
Need a full solid button instead of a text link? That’s the Creative Buttons widget. Want a heading, description, and button together? Look at the Call to Action widget.
Frequently Asked Questions #
What is the Elementor Creative Links widget?
It’s a Master Addons widget that adds animated text links to Elementor. Instead of a plain color change, links get hover effects like Brackets, Text Fill, and (with Pro) Circle and 3D Slide, all set from a dropdown with no custom CSS.
How many link effects are included?
The widget has 22 effects. Ten are free, including Brackets, Bottom Line Slide, Text Fill, Three Dots, and Move Up. Twelve need Pro, including 3D Effect, Slide In, Circle, Border Switch, Cross, and 3D Slide. You preview each one live in the Elementor editor before you publish.
Is the Creative Links widget free?
Yes. Creative Links is part of the free Master Addons for Elementor plugin with 10 effects. Master Addons Pro adds the other 12 effects. See the pricing page for the full comparison.
What is the difference between Creative Links and Creative Buttons?
Creative Links animates inline text links, like a “Read more” or a phrase in a sentence. Creative Buttons styles a solid, padded button. Pick Links for text-style calls to action and Buttons for block-style ones.
Do the link hover effects work on mobile?
Hover effects need a mouse, so they don’t trigger on touchscreens. Design the resting state to look complete, and the link still works and reads well on phones and tablets.
Wrapping up #
The Elementor Creative Links widget gives your text links movement: 22 hover effects (10 free), an icon, and color controls for the animation layers, with no code. Pick an effect, set the colors, and your links stop just sitting there. From here, the rest of the Master Addons widget library is worth a look.
