Sign In | Subscribe
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Adobe Dreamweaver CS6
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Transcription

  • Related Books

Bookmark and Share

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

Email Links

  • We are going to talk about email links on a web page and add an email link to on the about-us page for our website, we will also set up our email link to automatically add a cc email address & subject within the new email that opens
  • An email link is a link that a user can click & it opens the default email program on their computer
  • Email link issues
    1. You are assuming the user has email set up on that computer
    2. Exposing your email address to spammers
  • When you add a hyperlink to your website, you are accepting these issues
  • We will add an email link to our web page
  • Go to the about-us.html page
  • Place your cursor where you want the link on the page
  • Click on the letter icon in the Common tab of the insert bar
  • The text portion shows as text on the page, the email address portion goes into the code on the page
  • If you want the user to see the email address on the page, add it in the text portion
  • We can also add a subject, body, cc or bcc to the email automatically
  • Work through adding the link with cc, bcc & subject
  • Show adding only text on the page & create a second link that says Email & shows them the email address
  • It is usually best to allow the user to see the actual email address on the web page in case they are using an online email system

Email Links

Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Creating an Email Link 0:21
    • Insert Email Link
    • Adding Subject Line Information
    • Adding CC Recipients
  • Summary 9:54

Transcription: Email Links

What we're going to look at now is adding an email link to our website so people can email us directly from the website.0000

There are a couple of things I want to bring up when it comes to working with email links.0010

It is a decision you need to make when you are creating your own email links.0016

I'm on the Destinations page; but what I want to do is create an email link on the About Us page.0021

I'll go ahead and close up Destinations, and here is my About Us page.0030

But notice, there is no way to reach us based on this About Us page; so what I'm going to do is put an email link at the bottom of the page.0036

I'll hit Enter or Return at the very bottom; and what I want to do is add a link that the user clicks, and it will send me an email, and it will send it through the user's email system.0046

So, we're going to go back to the Common tab in the Insert bar up here; this Insert bar has many tabs...and click on the Common tab.0062

Now, with my cursor down here in the page, what I am going to do is click the second icon that looks like a little letter, and it says "Email Link."0073

And I am going to go ahead and click on that, and I am going to say "Contact Us" as the text.0085

In the email area, what I want to do is put our email address; so I will say

That is how you create an email link.0106

Dreamweaver makes it fairly simple.0109

Now, a couple of things with regards to this email link: first of all, if I click on this link in the browser, what it is going to do is trigger my email system on my machine.0112

And it is going to pop open a new email message for me that is blank.0125

So, it's using my email setup on my machine as a user.0130

What if I don't have email set up on my machine?--well, then this link is useless to that person.0135

So, that is our Contact Us email link.0144

Now, the other issue: if you are going to put text like this, notice, you can't see the actual email address; so if it was somebody that wanted to email us, there is no way to list the email address.0147

So, what I might want to do, instead of this, is put some different text in.0164

But let me save this; and if I click on this link, you will see that it does go down in the link area, just like any other hyperlink, but if I go to the beginning of this hyperlink, notice: it says "Mail to," and then it has an info@.0169

That is going to trigger my email.0189

Now, what if I wanted to allow the user to see my email address?--let me do a second one underneath this one to show you the difference.0192

I'm going to click that email link once again; whatever I used last in the email address ends up remaining there, and what I am going to do is copy that, and up in the text, I'm going to say "Email Us:" and I'll show that email address.0203

It is down in here, just like it was before.0225

So, I'll click OK; now, what can happen is: if the user doesn't have email set up on their system (and I tend to find a lot of people don't anymore--they used to always), at least they have our email address.0229

They can look at this and copy it easily, or they can right-click and copy it in their browser and paste it into their email system to email us.0245

So, it is really a preferred method to show the email address nowadays, because of that situation.0256

I am going to delete this "Contact Us" just by simply selecting it; and I'll hit the Backspace key or the Delete key with the back arrow and get rid of that extra space.0264

This is a much more worthwhile email link.0279

Now, what if I don't want the "Email Us" portion to be the hyperlink--I only want the email address to be the hyperlink?0282

What I can do is select it, and simply go down into the link area for that text and delete what is there in the link.0291

Now, you can see: it removed the email, or the actual clicking ability of an email, for that text.0302

So, it removed this from being a part of the email hyperlink.0312

Now, another issue with using an email link is: spammers do go out, and they monitor the Web.0317

They have programs...just like Google to search, these are programs to search; it just so happens they are searching for email addresses.0327

They add it to their database, and then, once they get enough of them, they sell them to spammers.0336

So, any time you put your email address out on the Web, you are opening yourself up to quite a bit of extra spam mail--so just be aware of that.0343

I'll go ahead and save this page; I'll put it in the browser; so I'll preview it here, and let's take a look at what happens when I click the link.0356

You can see, it pops up a brand-new email for me.0367

Now, it puts the cursor in the subject line; but it might be convenient to have that subject line have some information in it.0372

Let's take a look at doing that.0380

I'll close that up, and let me show you how to add that.0384

Now, you will need to add it in Code View, but I think you will find this valuable.0387

Let me go into Design View, actually, and highlight this so you can locate it easier.0393

Then I'll go into Split View; and here is my email information.0399

Now, this a href is the actual hyperlink, and notice: it's blue on the page.0405

So, down towards the bottom, look for the blue text that says "Mail to"; what I am going to do is add some content to it.0413

I'll move this down so you can see a little bit easier what I am doing.0423

All right, so after the .com here, I want to add a subject line automatically in the email message.0429

I am going to put a question mark to do this, and I am going to say subject= , and now I write out whatever the subject is.0439

I am going to say "Website," and I need a space, but spaces are forbidden on the Web; so I'm going to put in a %20 to represent a space.0449

This is going to be a Website%20Email%20 (you have to remember that for your spaces) it's going to say Website%20Email%20Contact.0464

OK, I'll save my page; now, the question mark segregates the subject line from the actual email address; so that is what it is doing.0479

And this says subject= , and then, after the equals sign, before the double quote, you put in whatever you want as your subject.0490

And any time you need a space, you put in %20.0500

Now, you saw that link prior to doing this; let me put it in Safari, and now when I click on it, it is going to pop up an email message: and notice it has a subject line.0505

What if I wanted a CC line?--well, I basically do the same thing.0521

I'll scroll down to the bottom once again; but this time, instead of saying subject= , what I can do is add an ampersand, and I'm going to say cc= , and I'll put another email address.0527

I'll say (oops, where is my dot?--there we go); so I'll set that one up, do a save, and put it back in the browser.0544

I need to make sure that this is the same page I had in the same browser I had; so make sure you do a refresh or a reload of the page, so it grabs that new code I saved.0561

I'll click on it, and there is my CC and my subject, in addition to my email address.0576

The user has their cursor right in the area to send me off a message from the website page.0586

That is how you can add--not just an email link--to your pages, but you can also, within that email, add a subject area and a CC...and if you wanted a BCC, you just repeat that same thing, just adding bcc= .0594

That is adding an email link to your web page using Dreamweaver.0614