AI popups

Create interactive experiences with just a prompt.

Custom AI-coded popups allow you to fully customize the contents and layout of layer interactions within Felt. With this feature you can build a custom interface and layout all within the Felt interface.

Examples

Interactive Charts

Automatically generate interactive charts directly inside your popup to reveal trends and patterns at a glance.

Advanced navigation

Quickly create popups with expandable sections or tabbed navigation, so users can explore details without being overwhelmed.

Branded popups

Create custom popups that reflect your organization's identity, with brand colors, typography, and logos applied automatically.

Create a custom popup with Felt AI

  1. Click Extensions () in the toolbar and select the option for Custom popup

  2. Select the layer from the menu and click Next

  3. The popup interface will open with Felt's default popups in preview

    1. the left side: code editor (HTML/CSS/JS) and AI prompt area to chat with Felt AI (plus console logging for debugging)

    2. the center: previews (desktop & mobile available)

    3. the right side: layout controls (see layout options)

  4. Describe what you want your popup to display by typing in the AI prompt area

  5. Review the generated HTML/CSS code and preview the pop ups in both Desktop and Mobile mode

    1. You can modify the code directly in the code editor.

  6. Click Save (top right) once you are finished editing the popup

  7. Test the popup experience by clicking on a feature in your map.

All edits and changes are applied immediately to your previews, and once saved the changes are applied immediately to the live map.

You can always return to the configuration settings by clicking on Edit... in the Content row.

Example prompts

  • "Create a popup with tabs showing property details, demographics, and transit data in separate card layouts with the property photo at the top"

  • "Show a bar chart comparing this location's sales data to regional averages"

  • "Add an expandable section that shows basic info first, with a Show Details button"

Learn more

See Popup interactions to learn about tips and tricks, advanced features, and debugging.

Frequently Asked Questions

What are Custom AI-coded popups in Felt?

Custom AI-coded popups allow you to fully customize the contents and layout of layer interactions within Felt, all using HTML, CSS and JavaScript. You can build a custom interface and layout all within the Felt interface without leaving the platform.

Who can access AI-coded popups?

This feature is only available to admins and editors on the Enterprise plan. To upgrade, you need to contact sales.

Do I need to write code to use this feature?

No, you can describe what you want using natural language prompts in the AI prompt area. Felt AI will generate the HTML/CSS/JS code for you, though you can modify the code directly if desired.

Can I preview my popup on different devices?

Yes, you can preview your popup in both Desktop and Mobile mode before saving.

When are changes applied to my map?

All edits and changes are applied immediately to your previews. Once saved, changes are applied immediately to the live map.

How do I edit a popup after saving it?

You can return to the configuration settings by clicking on "Edit..." in the "Content" row.

What languages/technologies can I use in the code editor?

The code editor supports HTML, CSS, and JavaScript.

Can I modify the generated code?

Yes, you can modify the code directly in the code editor after Felt AI generates it.

How do I test my popup after creating it?

Test the popup experience by clicking on a feature in your map.

Where can I find more information about popups?

See Popup interactions documentation for more detailed information about popups.

Last updated

Was this helpful?