Journey Map Table: Configure and Use
Published on November 13, 2026
User Journey Map Builder
Journey Map Table: Configure and Use
Audience: Admins who set it up, and users who read journey maps
Component name in App Builder: Journey Map Table |
1. What It Is
The Journey Map Table shows a Journey Map record as a visual, read-only journey map. The phases run left to right, and each type of insight has its own row.
| Note: The Table doesn't edit anything. Phases are edited on their own records or in the Journey Storyboard, which has an Edit mode. |
2. What Users See
| Area | What It Shows |
| Header banner | The map name, Persona and Scenario/Objective, and a count of phases |
| Phase chevrons | The numbered phases in order, left to right, in graduated colors |
| User Actions | What the user does in each phase (blue) |
| Touch Points | Where the interaction happens (purple) |
| Emotions | A curve across the phases with an emoji for each (Delighted, Neutral or Frustrated) |
| Pain Points | What gets in the way (red) |
| Possible Solutions | Ideas to improve it (green) |
- Phases appear in the order of their Order field.
- The row names come from the field labels, so a renamed or translated label shows up automatically.
- Empty cells are left blank, and the layout stays aligned.
- Hovering over a card lifts it slightly.
The Emotion Curve
- The height of each emoji shows the mood: top for Delighted, middle for Neutral, bottom for Frustrated.
- A smooth line joins the phases, so the high and low points are easy to spot.
- A phase with no emotion value is shown as Neutral.
3. Add It to a Journey Map Page
- Open any Journey Map record.
- Click the gear icon, then Edit Page.
- In the components list, find Journey Map Table and drag it onto the page. A full-width region works best.
- Optionally set the properties in section 4.
- Click Save. If this is the first time the page has been customized, click Activate and choose the assignment, such as org default.
4. Settings
| Property | What It Does | Values | Default |
| Palette Color | The color family used for the phase chevrons. Each phase gets a progressively deeper shade. | blue, green, orange, pink, purple, teal, indigo, cloud-blue, hot-orange | blue |
| Good to know: Palette Color is the only setting. The lane colors are fixed so the rows stay recognizable across maps. |
5. Requirements
- The Journey Map Phase records must be related to the map and have values in the Order field.
- The three emoji images must be present as static resources:
happypng, neutralpng and sadpng. The Table doesn't show emojis without them. - Users need Read on both objects and their fields. See the Permissions Guide.
- The Table works on any Lightning record page for Journey Map.
6. Responsive Behavior
The Table adjusts to the width of the page region where you place it, not the browser window.
| Region Width | What Users See |
| Wide | The full matrix: phases across the top, one row per insight |
| Medium | The same matrix with slightly smaller text and emojis |
| Narrow (about 760px and under) | A vertical timeline of phase cards, each with a colored header, a mood badge and only the sections that have content |
- If there are more phases than fit across the screen, a horizontal scrollbar appears at the bottom of the matrix. The row labels stay pinned on the left while the user scrolls.
- For the best view, place the Table in a full-width region and not in a narrow sidebar.
- The Table also supports reduced-motion settings and prints cleanly.
7. Tips for Good Results
| Keep phase names short, around 2 or 3 words, so the chevrons stay tidy. | Use bullets in the rich-text fields, one idea per line. | Aim for 4 to 7 phases. A map with many more phases will need horizontal scrolling. | Fill in Emotion for every phase, because the curve is the main visual. | If every row of a phase is empty, double-check its Order and that it's linked to the right map. |
8. Troubleshooting
| Symptom | Likely Cause | Fix |
| Nothing shows below the header | The map has no phases, or the user can't read them | Add phases, check permissions |
| Phases appear in the wrong order | Order values are wrong or duplicated | Correct the Order numbers |
| Emojis missing | Static resources missing or renamed | Check happypng, neutralpng and sadpng |
| Chevron colors look flat | The browser doesn't support the color tokens | Update the browser. A blue fallback is used |
| Layout looks cramped | The region is too narrow | Use a wider region, or let the stacked view take over |
| A row label is wrong | A custom field label was changed | Row names follow the field labels, so rename the field if needed |
| The component isn't in the list | It was not added to the page's object | Edit a Journey Map record page, not another object's page |
Knowledge Article Number: KA-00503