Add Email Links and Link Messages to Your Website

Adding a Basic Email Link To Your Site

If communicating with the readers of your website and having them communicate with you is important, then learning to be creative with your email links may be very helpful.

How to add a contact by email link on a web page
Campaign Creators / Unsplash

What Are Email Links?

Did you know that you can put things in your link so that when your readers click on it there will already be a message for them to start with? You can put a subject in the subject line or a message in the body of the email. This makes sorting your email really easy. You can also have the email sent to several different email addresses if you want to.

Let's say that you want to know which page someone is emailing you from, you can put a code or message in the email so that when it comes to you, you will know which page it came from just by seeing it. Maybe you have a list of questions that people can ask you or different categories of something on your site. You can put different messages on each one so that you will know what your reader wants before you even read the email.

What You Can Include in an Email Link

Here are some things you can use in your email links.

mailto = Tells the email client who to send the email to.

subject = This will put a message in the subject line of the email.

body = With this option you can place a message in the body of the email.

%20 = Leaves a space between words.

%0D%0A = Takes your message to the next line. This is similar to the "Return" or "Enter" key on your keyboard.

cc = Carbon copy or have the email sent to another email address other than the mailto address.

bcc = Blind carbon copy or have the email sent to another email address other than the mailto and cc addresses.

How to Use Email Link Options

This is how you can use these things to help you. First, you need to know how to write a basic email link. A basic email link starts very much like a regular link:

" data-component="link" data-source="inlineLink" data-type="internalLink" data-ordinal="1">

It also ends very much like a basic link:

">Text For Link Here

What happens in the middle is what is different. You will, of course, want to start with adding your email address so that your readers can send the email to you. This will look something like this:

mailto:email@address.com

Now that you know that much, you can put together a basic email link. It will look like this to your readers:

Text For Link Here

It will open your email client so that you could send an email if we were using a real email address that is. Since I'm not using a real email address, you can't really send an email with it. Try replacing the false email address with your own, in your text editor (save the file with a .htm or .html extension first), and see if you can send yourself some email.

Add to a Basic Email Link

Now, let's take that basic email link and add to it. First, we have the basic email link that looks like this:

subject to the email

We would do this by first adding a question mark (?), then adding the subject code and finally adding what you want the subject line to say. Don't forget to add the space code between the words. Your code may work on some browsers, but it may not work on them all. The code to add the subject link would look like this:

?subject=Subject%20Text%20Here

This is how it will look to your readers:

[mail url=email@address.com?subject=Subject%20Text%20Here]Text For Link Here[/mail]

Go ahead and try it. See how the text shows up in the subject line now?

Add More Options

Now you can add the other things. Add a message in the body of the email or add other email addresses to have your email sent to. When adding a second attribute to your email link you will start it with an ampersand (&) and not a question mark (?).

The code to add text in the body of the email would look like this:

&body=Hello%20everyone!!%20This%20is%20your%20body%20text.

This is how your email link looks now:

This is how it will look to your readers:

[mail url=email@address.com?subject=Subject%20Text%20Here&body=Hello%20everyone!!%20This%20is%20your%20body%20text.]Text For Link Here[/mail]

Go ahead and try it. See how the text shows up in the body of the email?

Add Email Addresses to the CC and BCC Lines

If you want to add email addresses to the cc and bcc line of the email, all you have to do is add the code for those too.

cc would look like this: &cc=email2@address.com

bcc would look like this: &bcc=email3@address.com

When you add these to your email link, the code will look like this:

This is how it will look to your readers:

[mail rul=email@address.com?subject=Subject%20Text%20Here&body=Hello%20everyone!!%20This%20is%20your%20body%20text.&cc=email2@address.com&bcc=email3@address.com]Text For Link Here[/mail]

Try it and see how it works!

Skip Lines in the Body Text

One last thing. You can make the body text, that you added, to skip lines if you want. Just add the code for it inside the body text.

Instead of: Hello%20everyone!!%20This%20is%20your%20body%20text.

You could do it like this: Hello%20everyone!!%0D%0AThis%20is%20your%20body%20text.

Your code will now look like this:

This is how it will look to your readers:

[mail url=email@address.com?subject=Subject%20Text%20Here&body=Hello%20everyone!!%0D%0AThis%20is%20your%20body%20text.&cc=email2@address.com&bcc=email3@address.com]Text For Link Here[/mail]

Click on it to see the difference. Instead of reading:

Hello everyone!! This is your body text.

It now reads:

Hello everyone!!

This is your body text.

That's all there is to it. Have fun!

Format
mla apa chicago
Your Citation
Roeder, Linda. "Add Email Links and Link Messages to Your Website." ThoughtCo, Nov. 18, 2021, thoughtco.com/add-email-links-and-link-messages-2652418. Roeder, Linda. (2021, November 18). Add Email Links and Link Messages to Your Website. Retrieved from https://www.thoughtco.com/add-email-links-and-link-messages-2652418 Roeder, Linda. "Add Email Links and Link Messages to Your Website." ThoughtCo. https://www.thoughtco.com/add-email-links-and-link-messages-2652418 (accessed March 29, 2024).