Skip to main content
Ken Nielsen
Ken Nielsen
Legend
June 18, 2019
Answered

How do I make a hotspot clickable as an email link?

  • June 18, 2019
  • 1 reply
  • 2849 views

I'm not doing this right and don't find an answer anywhere so need to come here...

I have made a hotspot on a page so viewer user can click on and get an email link. I've tried filling in some of the hotspot blanks but none of those work. Also, while I'm at it, I don't like 'default' email programs and usually want to communicate with the outside world using my gmail account... I'll bet that others have preferences other than default also. I'm not sure if there is some clever way to allow the user to choose another email app than default and use that with the link... that would be peaches if possible, but if not, just clicking and getting the default email app would be fine. As it is, I'm getting nothing but an error 404...

This topic has been closed for replies.
Correct answer BenPleysier

Image hotspots have fixed dimensions and cannot be used in responsive designs. Therefore you should try linking an image.

Having said that, an email link as in <a href = "mailto: abc@example.com">Send Email</a> uses the email client that has been installed on the system. In my case this is Outlook. If no client is installed, then no email is sent. Another problem is email harvesting. In my example, I would harvest abc@example.com and use it to send spam to, use the email address to send spam from or bombard the inbox with a barrage of 1,000 's of emails per minute.

Use a normal contact form to overcome all of this, it's your choice.

1 reply

BenPleysier
Community Expert
BenPleysierCommunity ExpertCorrect answer
Community Expert
June 18, 2019

Image hotspots have fixed dimensions and cannot be used in responsive designs. Therefore you should try linking an image.

Having said that, an email link as in <a href = "mailto: abc@example.com">Send Email</a> uses the email client that has been installed on the system. In my case this is Outlook. If no client is installed, then no email is sent. Another problem is email harvesting. In my example, I would harvest abc@example.com and use it to send spam to, use the email address to send spam from or bombard the inbox with a barrage of 1,000 's of emails per minute.

Use a normal contact form to overcome all of this, it's your choice.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
    Ken Nielsen
    Ken NielsenAuthor
    Legend
    June 18, 2019

    Just like that. Good and correct. Thank You BenPleysier for good advice. I don't like contact forms as I want to start an email thread with customers... I'll just give the address and let them type it into whatever method they prefer to get the ball rolling. Just as one more question, can I use a hotspot to let them click on and load the email address into their 'copy' function so they can 'paste' it into the method of their choice... I'm stretching here but even that would be something where they could click on and do no damage.


    Thanks!

    BenPleysier
    Community Expert
    BenPleysierCommunity Expert
    Community Expert
    June 18, 2019

    To answer your original question, copy and paste the following into  new document and try it out in a browser.

    <!doctype html>

    <html>

      <head>

        <meta charset="UTF-8">

        <title>Untitled Document</title>

        </head>

      <body>

        <img src="https://images.unsplash.com/photo-1458862768540-8b091824fe2d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60" usemap="#emailmap">

        <map name="emailmap">

          <area shape="rect" coords="290,235,320,265" href="mailto:test@example.com" alt="phone">

        </map>

        <p>Please click the email icon</p>

      </body>

    </html>

    If you want to obfuscate the email address, have a look at https://andrew.hedges.name/experiments/obfuscator/ or Google the subject for alternatives.

    As far as being able choose the mail client, tere is no choice.

    Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices