How to Add Email Link in Elementor

How to Add Email Link in Elementor

Last modified: June 15, 2026

Fiverr freelancers

An email link in Elementor creates a clickable element that opens the visitor’s default email client with your address pre-filled in the To field. When someone taps or clicks it on a phone, the Mail app opens automatically and they can send you a message without copying and pasting an address. This is the quickest way to add contact functionality to any Elementor page without installing a form plugin.

There are multiple ways to handle email on a website: a mailto link for quick one-click contact, or a contact form for structured enquiries. The method here covers the mailto link approach.

The method works on any Elementor element that accepts a URL: text, buttons, headings, icons, and images. No Elementor Pro license is required.

Show More

* This button will show the rest of the post and open up an offer from a vendor

Why Add an Email Link?

A clickable email link is faster for visitors than copying an address and opening their email manually. On mobile, tapping a mailto: link opens the Mail app or Gmail app directly with your address in the To field, ready to send. This matters most for contact pages, service pages, and any place where you want a visitor to reach you with as little friction as possible.

Email links also keep your address out of plain visible text on the page, which gives you some protection against the automated scrapers that harvest email addresses from websites. A visitor can still click through to email you, but the address does not appear as plain text that a scraper would collect.

If you need fields for subject line, phone, or message length, a contact form is the better choice. For a direct, one-click email contact point, the mailto: link is simpler and lighter than any plugin.

How to Add Email Link in Elementor

Adding a mailto link in Elementor takes about 30 seconds once you know where to look.

  1. In the Elementor editor, click the element you want to turn into an email link. This can be a Text widget, a Button widget, a Heading widget, an Icon widget, or an Image widget.
  2. In the Content panel on the left, find the Link field (on buttons) or click the chain icon next to any text to open the link picker.
  3. In the URL field, type your mailto address in this format:
    mailto:[email protected]
  4. Click the arrow to apply the link, then click Update to save.

Optional Parameters

You can pre-fill more than just the To address. Append these parameters after the email address with a ? separator:

mailto:[email protected]?subject=Website%20Enquiry&body=Hi%2C%20I%27d%20like%20to%20enquire%20about
  • subject=: pre-fills the subject line (use %20 for spaces)
  • body=: pre-fills the opening message body

Use Descriptive Anchor Text

Do not use your email address as the visible link text. Instead, use something like Contact us, Email our team, or Get in touch. This makes the link more readable, passes accessibility checks, and avoids displaying a harvestable address in plain text on the page.

Bonus: Click-to-Call Link

The same technique works for phone numbers. Use tel:+44123456789 as the URL (include the country code) and link any text or button to it. On mobile, tapping it dials the number directly. Combine a click-to-call and a mailto link on your contact page for the two fastest ways visitors can reach you.

Final Word: How to Add Email Link in Elementor

Above are the instructions that you need to know when you would like to know how to add an email link in Elementor. It is simple, free, and doesn’t require Elementor Pro. However, Elementor Pro can be a great addition to your website. If you want to go beyond email links and add other types of links in Elementor , buttons, headings, or icons , we cover all the methods in our full linking guide.

Recap:
Save 4 Later
Email liked links to yourself

    Stay Updated with WordPress Insights

    Get the latest WordPress tips, theme reviews, and industry deals delivered to your inbox.