html

Mailto Link With HTML Body

Some online platforms want their customers to send emails. For this purpose, they have some links on the website that lets the customers directly send emails without needing to visit a particular email service and typing the recipient’s email address separately. The “mailto” link is used in HTML to direct the user to an email service.

This article will discuss the method to add the “mailto” link inside the HTML body.

How to Use “mailto” Link With HTML Body?

To insert a “mailto” link, an “anchor” tag with the “href” attribute is required and the email address of the recipient is inserted in that “href” attribute.

Syntax

The syntax for adding a “mailto” link in the HTML body is as follows:

<a href="mailto:[email protected]">Email</a>

Adding the “mailto” Link

The “mailto” link in HTML can be added simply by adding an anchor tag with the “href” attribute. The “mailto” link is then added as the value of the “href” attribute in the opening “anchor” tag.

Example

Let’s understand this with an example:

<h2>Click the Link Below to Send an Email</h2>
<a href="mailto:[email protected]">Send an Email</a>

In the above HTML code snippet:

  • An “<h2>” header element has been added with the text “Click the Link Below to Send an Email”. This has nothing to do with the actual functionality of the “mailto” link and it has just been added to create a heading in the output.
  • After that, there is an “anchor” tag with the “href” attribute and the “href” attribute has the email address of the recipient as its value.
  • Between the opening and closing “anchor” tags is the link in the form of a text clicking on which will directly let the user compose the mail. When the user finally sends the email, it will then be received by the recipient added in the “mailto” link.

This will create a link in the output that will be represented as “Send an Email”. When the user clicks on the link, it will automatically open the email service with the email address of the recipient written already. The output display generated through the above code snippet will be the following:

This sums up the use of the “mailto” link in the HTML code snippet.

Conclusion

The “mailto” link in HTML is added by simply adding the “anchor” tag with the “href” attribute and adding the email address of the recipient as the value of the “href” attribute. The email address of the recipient is written after “mailto:” in the value of the href attribute. The above explanation guides clearly and precisely on how to insert a “mailto” link in the HTML body element.

About the author

Hadia Atiq

A Software Engineer and Technical Writer passionate about learning and spreading knowledge of the latest technology. I utilize my writing skills to help readers understand the importance and usage of modern technology.