Add Email Links and Link Messages

Adding a Basic Email Link To Your Site

Young woman with coffee using laptop
Thomas Northcut/Digital Vision/Getty Images

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

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.

Here is a list of some of the things that 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 that the mailto and cc addresses.

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:

<a href="

It also ends very much like a basic link:

">Text For Link Here</a>

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:

<a href="mailto:email@address.com">Text For Link Here</a>

It will look like this to your readers:

Text For Link Here

Go ahead, click on it, it will open your email client so that you could send email, if I was using a real email address that is. Since I'm not using a real email address, you can't really send email with it though. 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.

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

<a href="mailto:email@address.com">Text For Link Here</a>

Lets add a 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 your email link looks now:

<a href="mailto:email@address.com?subject=subject%20Text%20Here">Text For Link Here</a>

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?

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:

<a href="mailto:email@address.com?subject=Subject%20Text%20Here&body=Hello%20everyone!!%20This%20is%20your%20body%20text.">Text For Link Here</a>

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?

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:

<a href="mailto: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</a>

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!

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:

<a href="mailto: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</a>

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!!

More From Us