How to Create an Email Anchor

How to Create an Email Anchor thumbnail
Let users contact you easily by placing email anchors on your website.

With the advent of web development applications such as Adobe Dreamweaver and blog tools such as Wordpress, web design has become quite easy to do. These systems have replaced HTML coding with a simple graphical user interface that makes adding an email anchor as simple as clicking an icon and typing a URL. HTML programming, however, is useful to learn as it helps users understand how web pages work. Both Adobe Dreamweaver and Wordpress still allow users to code their websites using HTML.

Instructions

    • 1

      Open a blog tool such as Wordpress or a web development application such as Adobe Dreamweaver. In Wordpress, click the icon that has a globe and a chain on it. In Dreamweaver, click the chain icon.

    • 2

      Click on the "Link Type" drop-down box and select "Email" in Wordpress. In the "URL" box, type the email address where you would like the messages sent. Click "OK." In Dreamweaver, type the text that you would like to appear in the email link in the "Text" box. In the "Email" box type the email address where you would like messages sent.

    • 3

      Click the "Source" button in Wordpress or "Code" in Adobe Dreamweaver to access the HTML editor. Place your cursor below the "<html>" and "<body>" tags. Type in the following:

      <p>

      Contact customer service:

      <a href="mailto:customerservice@example.com?Subject=Membership%20sign%20upproblems">

      Email us</a>

      </p>

      The <p> tag starts a new paragraph and the </p> tag closes the paragraph. The text after the <p> tag (Contact customer service) will appear as normal text. The <a> tag defines the anchor and "href" is the actual link. Enter your email address after "mailto" followed by a "?Subject=" if you would like to enter a subject. Type your subject making sure to replace spaces with "%20." Close the anchor tag with the text that you would like to appear as the underlined link and then insert the </a> tag. Finish with a </p> tag.

Related Searches:

References

Resources

  • Photo Credit Comstock/Comstock/Getty Images

Comments

You May Also Like

Related Ads

Featured