ArcGIS Online

Crafting custom attribute displays in pop-ups

An important part of authoring good web maps is configuring pop-ups for layers. Pop-ups can be edited by opening up More Options on the layer:

Then choosing  Configure Pop-up:

There are several options to choose from when configuring the pop-up display, including choosing from and modifying a list of field attributes, choosing contents from a single field for display, and removing the attribute display altogether.

A very flexible choice that permits the combination of free text, field contents, and links is A custom attribute display. You’ll find it among the Pop-up Contents display options.

Choose A custom attribute display:

Then click Configure:

Working with Custom Attribute Display

In Custom Attribute Display you can enter a combination of free text and fields chosen from the drop down list.

For example, below we’ve added a combination of free text and fields in the pop-up configuration for a layer containing locations of high peaks in California. What appears within curly braces (brackets) are field names. When the pop-up is opened these will be replaced by the attributes for the feature.

After you’ve configured the custom display, save your changes by clicking Save Pop-Up.

Here’s how the above pop-up appears when opened:

Add more style

Other style options can be applied to field names as desired. Select the field name (including the curly braces) and apply the desired styling. Below we’ve changed the name of the peak to appear in bold blue text:

Adding links from fields

You can also use fields as text links in custom attribute displays. Use the drop down to select the field containing the link and add it to your custom attribute display. In this case we’ve chosen a field containing a link to the credits for the photo of each peak:

However when the pop-up is opened, we don’t quite get the desired result – we see the URL string displayed, but not as a link:

How do we create the link? Follow these steps:

Step 1. Select and copy the field name from the Custom Attribute Display panel

Step 2. Replace the field name with the text for the link and select it
Step 3. Click Create Link
Step 4. Paste the field name in the URL input shown below. Note that a warning – The value entered is not valid – will be displayed, which can be ignored. Click Set.

Here’s the pop-up after these changes. The text “Photo credit” is now a unique hyperlink, with the link going to the URL stored in {Photo_Credit} for each feature:

Enhancing your custom attribute display pop-ups

You can add other pop-up elements like images and charts to your custom attribute displays. We’ve completed our pop-up configuration by adding a link to a thumbnail photo of each peak, which when clicked opens a larger version of the same photo:

For more information

This post was originally published on July 25, 2013, and has been updated.

About

Tech evangelist and product strategist at Esri, focusing on ways to broaden access to geographic information and helping users succeed with the ArcGIS Platform. On a good day I'm making a map, on a great day I'm on one. Follow @bernszukalski or email bszukalski@esri.com

Connect:

Next Article

Using effective titles and subtitles in your story maps

Read this article