Preview and Test Pins
Learn more about the different methods you can use to thoroughly test your content before releasing it to your audiences.
Table of Contents
Before releasing a Pin to your users, verify that it appears on the right element, displays your content correctly, and only shows to the intended audience. There are three testing methods — use whichever fits your setup.
Choose a testing method
| Method | Best for | Tests targeting? | Tests interactions? | Requires staging? |
|---|---|---|---|---|
| Preview | Quick visual check while building | No | No | No |
| Publish to staging | Full end-to-end testing in a safe environment | Yes | Yes | Yes |
| Publish to internal testers | Full testing when you don't have staging | Yes | Yes | No |
Preview in the Builder
Use this for a quick visual check while you're still building.
- Open your Pin in the Appcues Builder.
- Click the Preview button (the eye icon) in the toolbar. The Pin renders on the page as an end user would see it.
- For Icon w/ Tooltip Pins, hover over or click the icon to confirm the tooltip opens and your content appears. For Button Pins, verify the button text and styling look correct.
Preview mode doesn't test targeting rules, user properties, CSS selector reliability, or button actions (Go to URL / Trigger Flow). For those, publish and test live using one of the methods below.
Publish to a staging environment
Publishing to staging is the most thorough testing method. It lets you validate targeting, element anchoring, styling in context, and button actions in a safe environment.
- Go to Settings > Available Domains and add your staging domain. You need admin access to do this. See Manage Available Domains for details.
- Open your Pin's settings page and go to the Page Targeting section.
- Select your staging domain from the domains list. The Pin will only display on that domain.
- Click Publish. The Pin goes live only in your staging environment — end users on production won't see it.
- Open your staging environment, navigate to the targeted page, and verify the Pin appears as expected.

Publish to internal testers
If you don't have a staging environment, publish the Pin to production but restrict it to a segment of internal testers.
- Create a segment for your testers. Common approaches:
- Target specific email addresses (e.g.,
emailequalstester@yourcompany.com) - Target your company email domain (e.g.,
emailcontains@yourcompany.com) - Target specific user IDs
- Open your Pin's settings page and set the Audience to Users in a segment, then select your testers segment.
- Click Publish. Only users in your testers segment will see the Pin.
- Sign in to your app as a test user and verify the Pin appears.
Once you've confirmed everything works, update the audience targeting to include your end users.

What to verify during testing
Appearance
- The Pin icon or button appears in the correct position relative to its target element
- Icon w/ Tooltip: the tooltip opens with hover or click (depending on your behavior setting) and displays your content correctly
- Button: the text, color, and style match your app's look and feel
- The Pin looks correct at different screen sizes and scroll positions
Element anchoring
Pins are tied to a CSS selector. During testing, confirm:
- The Pin stays attached to the correct element as you scroll, resize, and navigate
- If the target element loads dynamically (e.g., after an API call or user action), the Pin appears once the element is in the DOM
- The Pin doesn't appear on pages where the target element doesn't exist
If the Pin isn't anchoring correctly, refine the CSS selector. See the "Refine the target element" section in Create Pins.
Targeting
- The Pin appears only on the pages you've targeted (check with the Test Page Targeting tool on the settings page)
- The Pin shows only to users who match your audience conditions — and does not show to users who don't
- Use the Diagnostics tool in Studio to check a specific user's eligibility
Button actions and Flow interactions
- Go to URL buttons navigate to the correct destination (including dynamic URLs with profile attributes)
- Trigger Flow buttons launch the correct Flow. The Flow must be published.
- If you enabled Track event, confirm the event fires in Events Explorer
If something isn't working
Pin doesn't appear on the page:
- Open the Appcues Debugger and confirm Appcues is installed (all rows show green checkmarks).
- Verify the page URL matches your page targeting conditions using the Test Page Targeting tool.
- Confirm the target element exists and is visible in the DOM. If it loads dynamically, the Pin won't appear until the element is present.
- Check that the domain is included in your page targeting.
Pin appears but is misplaced or hidden:
- Increase the z-index in the sidebar position settings (try 99999 or higher).
- If the Pin is inline inside a container with
overflow: hidden, the tooltip may be clipped. Switch to Overlayed embedding or move the Pin outside that container. - Fine-tune the position with px or % offsets in the sidebar.
Pin shows to the wrong audience:
- Open the Diagnostics tool and check the user's eligibility. The panel shows which conditions pass or fail.
- User property values are case-sensitive —
Admin≠admin.
Button Pin doesn't trigger a Flow:
- Confirm the Flow is published and live.
- If the flow starts with a Tooltip or Hotspot, confirm the elements exist on the page it's being triggered. Add a redirect before the Flow is launched if necessary.
Pin doesn't appear inside a dropdown menu:
- Use Inline embedding so the Pin exists inside the menu's DOM tree. See Pins in dropdown menus.
If it's still not working, collect:
- Pin ID (from the URL on the settings page)
- User ID of the test user
- The URL where you're testing
- Screenshot of the Debugger showing installation status
Then contact Appcues support.