Page Targeting

Control which pages display the FeedbackJar widget using exclude patterns. Perfect for hiding the widget on admin pages, checkout flows, or sensitive areas.

Overview

Configure page targeting in your FeedbackJar dashboard under Widget Settings > Page Targeting. The widget will be hidden on pages matching your exclude patterns.

Exclude Pages

Add URL patterns to hide the widget on specific pages. Patterns are matched against window.location.pathname.

Exact Match

Match a specific page exactly:

/admin
/checkout
/settings

Examples:

• /admin - Only hides on exactly /admin (not /admin/users)
• /checkout - Only hides on exactly /checkout

Wildcard Patterns

Use * for flexible pattern matching:

Prefix Matching

Hide widget on all pages starting with a path:

/admin/*
/dashboard/*
/checkout/*

Examples:

• /admin/* matches:
  • /admin/users
  • /admin/settings
  • /admin/posts/edit
• /checkout/* matches:
  • /checkout/cart
  • /checkout/payment

Suffix Matching

Hide widget on all pages ending with a path:

*/settings
*/edit
*/admin

Examples:

• */settings matches:
  • /dashboard/settings
  • /profile/settings
  • /app/organization/123/settings
• */edit matches:
  • /posts/edit
  • /profile/edit

Contains Matching

Hide widget on any page containing a string:

*admin*
*checkout*
*settings*

Examples:

• *admin* matches:
  • /admin
  • /dashboard/admin/users
  • /superadmin/settings
• *checkout* matches:
  • /checkout
  • /cart/checkout/payment

Complex Patterns

Combine wildcards for advanced matching:

*/admin/*/settings
/app/*/checkout/*
*dashboard*settings*

Examples:

• */admin/*/settings matches:
  • /app/admin/users/settings
  • /dashboard/admin/posts/settings
• /app/*/checkout/* matches:
  • /app/store/checkout/cart
  • /app/shop/checkout/payment

Configuration

Via Dashboard

1. Navigate to Widgets in your dashboard
2. Go to Widget Settings
3. Scroll to Page Targeting
4. Add patterns to Exclude Pages
5. Click Save Changes

Dashboard UI

Exclude Pages
Widget will not appear on these pages. Use * for wildcards
(e.g., /admin/*, */settings, *dashboard*)

┌─────────────────────────────────────┐
│ /admin/*, */settings, etc.          │
└─────────────────────────────────────┘ [+]

Added patterns:
[ /admin/* ] [×]
[ */settings ] [×]
[ *checkout* ] [×]

SPA Support

The widget automatically detects URL changes in Single Page Applications (SPAs):

• Browser navigation - Back/forward buttons
• Client-side routing - React Router, Vue Router, Next.js routing
• History API - pushState and replaceState

The widget visibility updates automatically when routes change.

Supported Frameworks

• React (Create React App, Vite)
• Next.js (Pages Router & App Router)
• Vue.js (Vue Router)
• Angular (Angular Router)
• Svelte/SvelteKit
• Remix
• Any framework using the History API

Common Use Cases

Hide on Admin Pages

/admin/*
*/admin/*
*admin*

Hide on Checkout Flow

/checkout
/checkout/*
/cart
/payment

Hide on Settings Pages

*/settings
*/settings/*
*settings*

Hide on Authentication Pages

/login
/signup
/register
/forgot-password
/reset-password

Multiple Patterns

Combine patterns for comprehensive control:

/admin/*
*/settings
/checkout/*
/login
/signup
*dashboard/admin*

Best Practices

Be Specific When Possible

Use exact matches or prefix patterns when you know the URL structure:

Good:

/admin/*
/checkout/*

Avoid if possible:

*admin*  (may match unintended pages)

Test Your Patterns

After adding exclude patterns:

1. Visit your website
2. Navigate to excluded pages
3. Verify widget is hidden
4. Check that widget appears on other pages

Common Patterns

Admin sections:

/admin/*
/dashboard/admin/*

User settings:

*/settings
/account/settings
/profile/settings

Transactional flows:

/checkout/*
/payment/*
/onboarding/*

Wildcards vs Exact Matches

Debugging

Widget Still Showing?

Check these common issues:

1. Pattern not saved - Click “Save Changes” in dashboard
2. Case sensitivity - Patterns are case-sensitive (/Admin ≠ /admin)
3. Query parameters - Patterns match pathname only (ignore ?tab=widgets)
4. Trailing slashes - /admin and /admin/ are different

Current Page Path

Check the current pathname in browser console:

console.log(window.location.pathname);
// Example output: /dashboard/organizations/123/settings

Use this to write accurate exclude patterns.

Test Pattern Matching

Test your patterns in console:

const pattern = '*/settings';
const currentPath = window.location.pathname;

const regexPattern = pattern
  .replace(/[.+?^${}()|[\]\\]/g, '\\$&')
  .replace(/\*/g, '.*');
const regex = new RegExp(`^${regexPattern}$`);

console.log(regex.test(currentPath));
// true if matches, false if not

Examples

E-commerce Site

Hide widget during checkout but show on product pages:

/checkout
/checkout/*
/payment
/payment/*

SaaS Dashboard

Hide on admin and settings, show on main dashboard:

/dashboard/admin/*
/dashboard/settings
*/organization/*/settings

Multi-tenant App

Hide on all settings pages across tenants:

/app/*/settings
/app/*/settings/*
*/admin/settings

Marketing Site + App

Show on marketing pages, hide in app:

/app/*
/dashboard/*
/account/*

Related

• Configuration Options - Widget appearance settings
• Custom Triggers - Programmatic widget control
• User Identification - Personalize feedback