Widget Builder URL Field

Buttons and links need more than a web address. They need an open-in-new-window toggle, a nofollow option, and sometimes custom attributes. The URL field in the Master Addons Widget Builder gives your custom widget the same link control Elementor uses everywhere else, so editors get a familiar link picker instead of a plain text box.

You drop a URL field into your widget panel, choose which link options to expose, and connect it to your markup with a shortcode. This guide is focused on the URL field, but it also drops in a quick Text field so you can set the button label at the same time.

What the URL field does #

The URL field renders Elementor’s link control in your widget’s option panel. Editors paste a link, flip the options they need, and your widget outputs a proper anchor tag. A Text field holding a raw address can’t do that. The URL field handles the target and rel attributes for you, so external links open correctly and nofollow is one click away.

It pairs naturally with a Text field for the visible label. In a call-to-action button, the URL field carries the link and the Text field carries the words on the button.

Before you start #

• WordPress with Elementor installed and active.
• Master Addons for Elementor installed and active. New to the plugin? See the installation guide.
• A custom widget open in the Widget Builder editor. If this is your first one, read the Widget Builder overview first.

How to add a URL field #

In the Widget Builder editor, find the fields panel on the left and drag the URL field into a section under the Content, Style, or Advanced tab. Link controls usually live under Content. Once it is in place, the field’s options open on the left and its shortcode shows up in the Documentation sidebar next to the code editor.

URL field options explained #

Select the URL field to open its settings. The first few options match the other fields, then you get a set of link-specific choices.

• Label: the text shown above the control in Elementor, for example “Url” or “Button Link”.
• Name: the unique identifier for the field. Letters, numbers, and underscores only. This becomes your shortcode, so a field named url gives you {{url}}.
• Description: optional helper text shown below the control.
• Placeholder: the faint hint shown in the link box when it is empty.
• Default Value: a starting link, if you want the button to point somewhere before anyone edits it.

URL Options #

The URL Options group decides which parts of the link control appear in Elementor. Tick only what the widget needs:

• URL Input: the link field itself, where the editor pastes the address.
• Open in new window: a toggle that sets target="_blank" on the link.
• Add nofollow: a toggle that adds rel="nofollow", useful for sponsored or untrusted links.
• Custom Attributes: a field for extra attributes in key|value format, handy for analytics hooks or data attributes.

Common settings: responsive, dynamic, and more #

Below the URL Options you get the same Common Settings as every field in the builder: Show Label, Label Block, Responsive Control, Dynamic Support, Frontend Available, Separator, and Conditions. Dynamic Support is the useful one here, since it lets the link pull from a dynamic source. The Text field documentation explains each of these in detail.

Connect the field to your code #

The URL field gives you a shortcode plus a few sub-tokens, so you can map each link option to the right HTML attribute. For a field named url:

• {{url.url}} outputs the link address for the href attribute.
• {{url.is_external}} outputs the target, so the “Open in new window” toggle works.
• {{url.nofollow}} outputs the rel value for the “Add nofollow” toggle.

Drop these into an anchor tag, and add a Text field token like {{button_text}} for the visible label:

The anchor now pulls its link, target, and rel from the single URL control, and the Text field supplies the words. Save the widget and the button renders with whatever the editor sets. One thing worth knowing: if you only place {{url}} on its own, you get the address but not the target or nofollow behavior, so use the sub-tokens when those toggles matter.

Use the URL control in Elementor #

Drag your custom widget onto a page and open it in the Elementor editor. The URL field shows up as the standard link control: a box for the address, plus the toggles you enabled. Paste a link, switch on “Open in new window” if needed, and the button updates live.

In the demo, the Text field labeled “Button Text” sets the button to “Choose Your Plan”, and the URL field points it at the target link. Two small fields, and you have a fully editable call-to-action button that anyone can update from Elementor.

Common use cases #

• Call-to-action buttons with editable link, text, and new-window behavior.
• Pricing or plan buttons that point to checkout.
• Read more links on cards and feature blocks.
• Sponsored or affiliate links where nofollow matters.
• Tracked links using Custom Attributes for analytics data.

Tips for working with the URL field #

• Only expose the options you need. If a button never opens a new tab, leave that option off to keep the control clean.
• Use the sub-tokens, not just {{url}}. Map {{url.url}}, {{url.is_external}}, and {{url.nofollow}} so every toggle actually does something.
• Pair it with a Text field for the button label instead of hard-coding the words in your HTML.
• Turn on nofollow for sponsored links to stay on the right side of search guidelines.
• Build the field before referencing its shortcode. The token exists only after the field is on the panel.

Frequently Asked Questions #

Wrapping up #

The Widget Builder URL field turns a plain link into a full Elementor link control inside your own custom widget. Pick the options to expose, wire the sub-tokens into your anchor tag, pair it with a Text field for the label, and you have an editable button that handles links, new windows, and nofollow with no hard-coded markup. Have a look at the rest of the Master Addons widgets and extensions, and check the pricing page for what each plan includes.