Send email from web map pop-ups

Email can be sent directly from web map pop-ups using pop-up configurations. Which configuration approach is best will be determined by how the email addresses are stored in the layer attributes. This post shows you how to send an email directly from a pop-up, and covers two examples of how the email might be stored; as an email address (somebody@company.com), and as a mailto link (mailto:somebody@company.com?subject=Hello).

You can follow along using a sample web map, click Modify Map or save a copy of the map to your account before you begin.

The map contains two layers; Office Location (original) and Office Location (configured).

The original layer does not have a configured pop-up, it’s the default and unimproved display of attributes. Use this layer to follow along with the instructions below. The configured layer uses a configured pop-up using all the email options described in this post.

*
The unconfigured pop-up

Click the symbol on the map to display the pop-up. In the original pop-up, shown below, the email address is stored in two ways. The Email field stores the address as a string in the format somebody@company.com. The Mailto Link field stores the address as a string in the format mailto:somebody@company.com?subject=Hello.

Note that both are displayed as text strings, rather than links. Using the techniques described below, the pop-up can be configured to use both variations on the email strings as clickable email links in the layer pop-up.

*
Configuring the pop-up

In the map Contents, move your mouse over the layer name to highlight it, and click the layer context menu (the dots) to reveal More Options.

Choose Configure Pop-up from the options list. This will display the Pop-up properties.

Using the pop-up properties, the pop-up can be configured in a variety of ways to enable an email link from the pop-up window. Follow the steps below.

*
Case 1: Email stored as a mailto link

The Mailto string can be configured as a mailto link in the pop-up using two methods; the first is using a custom attribute display, the second uses a link from an image.

*
Method 1 – Using a custom attribute display

Step 1. From the Pop-up Properties choose A custom attribute display.

Step 2. Click Configure.

Step 3. Along with other desired text and attributes, enter a text string to use for the email link and select it.

Step 4. Click Create Link to add a link to the selected text.

Step 5. In the URL input, enter the field name containing the mailto string using the curly braces – in this case the field is {Mailto}.

Tip: you can add the mailto field to your custom attribute display, then cut and paste it into the URL input instead of typing. You will notice a warning, but the warning can be disregarded.

Step 6. Set the Link Properties.

Step 7. Click OK, then save the pop-up configuration and map. The pop-up now includes the mailto attribute as a clickable link.

*
Method 2 – Using an image link

Step 1. From the Pop-up Media section of Pop-up Properties choose Add Image.

Step 2. In Configure Image add a Title and Caption as desired.

Step 3. Choose a field for the URL. This field contains a URL to an image that will be displayed in the pop-up, in this example it is an icon of a envelope.

Step 4. Add the field containing the mailto string to Link.

Step 5. Click OK.

Step 6. Save your pop-up configuration and your map. The pop-up now includes an image which can be clicked, or tapped if using a device, to send an email.

*
Case 2: Email stored as address string

If the attribute field contains a standard email address string (somebody@company.com) a mailto link can be configured in the pop-up using two methods shown below.

Method 1 – Using a custom attribute display

Step 1. From the Pop-up Properties choose A custom attribute display.

Step 2. Click Configure.

Step 3. Along with other desired text and attributes, enter a text string for the email link and select it.

Step 4. Click Create Link to add a link to the selected text.

Step 5. In the URL input, type the properly formatted mailto link using the field name containing the email address – in this case the field is {Email}.

Tip: You can add the email field to your custom attribute display, then cut and paste it into the URL input instead of typing it in.

Step 6. Set the Link Properties.

Step 7. Click OK, then save the pop-up configuration and map. The pop-up now includes a clickable link using the email address string.

*
Method 2 – Using an image link

Step 1. From the Pop-up Media section of Pop-up Properties click Add, then choose Image.

Step 2. In Configure Image add a Title and Caption as desired.

Step 3. Choose a field for URL. This field contains a URL to an image that will be displayed, in this example it is a thumbnail image of a letter.

Step 4. Add the field containing the mailto string to Link.

Step 5. Click OK.

Step 6. Save your pop-up configuration and your map. The pop-up now includes an image which can be clicked, or tapped if using a device, to send an email.

*
Summary

Using the sample map, turn off the original layer and turn on the configured layer.

Click the point location on the map to view a pop-up configured with all the options described above.

*
More information

Custom attribute displays and links from images in pop-ups provide opportunities to customize the capabilities presented in pop-up, including the ability to create a link to send an email.

For more information see Configure pop-ups.

This post was originally published on October 1, 2015, and has been updated.

This entry was posted in ArcGIS Enterprise, ArcGIS Online and tagged , . Bookmark the permalink.

Leave a Reply

15 Comments

  1. bkeinath says:

    This is really fantastic! Great instructions and I love the examples. I was able to implement this in a few minutes.

  2. marcuskitchens says:

    I like how this works on a mobile device too. Great blog Bernie!

  3. msouff says:

    Say I what to do this, but with phone numbers so the user can make calls directly from Collectors for ArcGIS. Is there a way to to this?

    Thanks,
    Michael

    • Sam Jenkins says:

      Michael,

      I had the same question and a quick Google led me to try this as the link for the image “tel:{PhoneNumberField}”.

      Works like a charm in Collector and Explorer on iOS.

      Cheers
      Sam

      • Sam Jenkins says:

        A little more digging shows a link “sms:{PhoneNumberField}”, which is txt in the format xxx-xxx-xxxx will work on iOS too. Comments on Googled pages indicates that the support might be a bit more variable. Currently testing in an Automatic Vehicle Location (AVL) application, to enhance communication between field crews working with Collector for ArcGIS on iPads. Might be a good implementation for a crowd-sourced Outage Management System.

  4. pmoleirinho says:

    Hello! Thanks for posting this. Has anyone figured out a way to email what is in the pop up or even a snapshot of the map in Collector?

  5. jyh says:

    Just what I needed, but I’ve noticed a potential problem for my users. In IOS Collector, it opens the native email app, but on the computer, the email (gmail on our network) opens in the same window, which means that users who add a point from their desks run the risk of losing their edits. Some people will be confused and not find their way back to the map at all. I tried adding &target=_blank, but it doesn’t work, possible because I don’t have the syntax or punctuation quite right.
    Anyone have any suggestions?

  6. c_deering says:

    This worked a dream in the example and is exactly what i need. When I try in in my webmap it none of the options work, either i just go in i loop back to the webmap or the url isn’t recognised. Any advise please?

  7. lodecombe_diretudes says:

    Hi,

    Is it possible to put text message directly in configuration pop-up?

    • Bern Szukalski says:

      This post uses a mailto: link, so you are limited by what that offers and there may be email-specific caveats. That said, I found a reference online describing how to add body text in the mailto: using &body. Search and you’ll find more info on this.

      Example:
      mailto:someone@example.com?Subject=Hello%20again&body=Geography%20matters

      In the pop-up this could be:
      mailto:{email}?subject=Hello&body={body_field}

      I have not tried, but this might work for you. You can try experimenting here:

      http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_link_mailto