Troubleshooting

Common issues and solutions for Notedis widget installation and usage.

Widget Installation Issues

Widget doesn't appear on my site

Symptoms: The feedback button is not visible after adding the widget code.

Common Causes & Solutions:

  1. Incorrect site key
    • Verify your site key in the dashboard
    • Ensure you copied the entire key without extra spaces
    • Check for quote marks or formatting issues
  2. Code placement
    • Widget code must be placed before the closing </body> tag
    • Not in <head> section
    • Not after </body> tag
  3. Cache issues
    • Clear browser cache: Ctrl+F5 (Windows) or Cmd+Shift+R (Mac)
    • If using CDN (Cloudflare, etc.), purge CDN cache
    • For WordPress: Clear plugin cache (WP Rocket, W3 Total Cache, etc.)
  4. Browser extensions blocking widget
    • Try in incognito/private mode
    • Disable ad blockers temporarily
    • Disable privacy extensions (Privacy Badger, uBlock Origin, etc.)
  5. JavaScript errors
    • Open browser console (F12)
    • Look for red error messages
    • Common issues:
      • Conflicting JavaScript libraries
      • CSP (Content Security Policy) blocking external scripts
      • CORS issues

Quick Fix:

<!-- Verify this code is present before </body> -->
<script>
  window.notedisConfig = {
    siteKey: 'your-site-key-here',
    apiUrl: 'https://notedis.com'
  };
</script>
<script src="https://notedis.com/js/widget.js" defer></script>

Widget appears but styled incorrectly

Symptoms: Button appears but looks broken, overlapped, or oddly positioned.

Solutions:

  1. CSS conflicts
    • Your site's CSS may be conflicting with widget styles
    • Add custom CSS to override:
/* Increase specificity for widget button */
#notedis-feedback-button {
  z-index: 999999 !important;
  position: fixed !important;
}
  1. Position adjustment
    • Try a different corner in configuration:
window.notedisConfig = {
  siteKey: 'your-site-key',
  apiUrl: 'https://notedis.com',
  position: 'bottom-left' // Try different corners
};
  1. Theme conflicts (WordPress)
    • Some themes aggressively style all elements
    • Try disabling theme temporarily to test
    • Contact theme author about compatibility

Widget appears on some pages but not others

Symptoms: Widget works on homepage but not on other pages, or vice versa.

Solutions:

  1. Check page-specific code
    • Some pages may have different templates
    • Ensure widget code is in site-wide footer, not page-specific template
  2. SPA route changes
    • For React/Vue/Angular apps, widget persists across route changes by default
    • If it disappears, check if your app is force-reloading the page
  3. Conditional logic
    • Check if you added conditional logic that excludes certain pages
    • Review your implementation code
  4. Cache issues
    • Clear cache for specific pages
    • Some caching plugins cache pages individually

Feedback Submission Issues

Feedback form opens but won't submit

Symptoms: Modal opens, user fills form, but submission fails.

Solutions:

  1. Network issues
    • Open browser DevTools → Network tab
    • Look for failed requests (red)
    • Check error response
  2. Trial or subscription expired
    • Verify your trial hasn't ended in dashboard
    • Check subscription status if on paid plan
  3. Site is paused
    • Check if site is active in dashboard
    • Paused sites don't accept feedback
  4. Required fields
    • Ensure all required fields are filled
    • Check console for validation errors
  5. File size issues
    • Maximum file size: 25MB
    • If uploading multiple files, check total size

Debug Steps:

// Check if widget is loaded
console.log(window.notedisWidget);

// Check configuration
console.log(window.notedisConfig);

Submitted feedback doesn't appear in dashboard

Symptoms: Form submits successfully but feedback not visible.

Solutions:

  1. Wrong workspace
    • Switch to correct workspace in dashboard
    • Check "All Sites" view
  2. Filters applied
    • Clear any active filters in dashboard
    • Check if feedback is in different status
  3. Email verification
    • Ensure your account email is verified
    • Check spam folder for verification email
  4. Browser refresh
    • Hard refresh dashboard: Ctrl+F5 or Cmd+Shift+R
    • Try different browser

Screenshot & Annotation Issues

Screenshot not capturing correctly

Symptoms: Screenshot is blank, partial, or has missing elements.

Solutions:

  1. Cross-origin images
    • External images (from different domains) may not capture due to CORS
    • Images need proper CORS headers
    • Not much we can do without server changes
  2. Canvas/WebGL content
    • Some canvas elements don't capture properly
    • This is a browser limitation
  3. Browser compatibility
    • Screenshot works best in:
      • Chrome (recommended)
      • Firefox
      • Edge
    • Safari has known limitations
  4. Use file upload alternative
    • If screenshot fails, users can upload image manually
    • Click "Upload File" instead of screenshot

Annotation tools not working

Symptoms: Can't draw or add annotations to screenshot.

Solutions:

  1. Browser compatibility
    • Ensure using modern browser (Chrome, Firefox, Edge)
    • Update browser to latest version
  2. Touch vs mouse
    • On touch devices, use finger or stylus
    • On desktop, click and drag
  3. JavaScript errors
    • Check browser console for errors
    • Try in incognito mode

WordPress-Specific Issues

Widget disappears after theme update

Solution: Use Code Snippets plugin (Method 1 in WordPress installation) instead of editing theme files. This survives theme updates.

Widget conflicts with other plugins

Symptoms: Widget breaks when certain plugins are active.

Solutions:

  1. Identify conflicting plugin
    • Disable plugins one by one
    • Test widget after each disable
    • Note which plugin causes conflict
  2. Common conflicts
    • Page builders (Elementor, Divi) - usually fine but check z-index
    • Caching plugins - clear cache after installation
    • Security plugins - may block external scripts
  3. Report to support

Widget not loading in Gutenberg editor

Expected behavior: Widget only appears on public-facing pages, not in admin or editor.

This is intentional. The widget is for site visitors, not admin users.

JavaScript Errors

"notedisConfig is not defined"

Cause: Widget script loading before configuration.

Fix: Ensure configuration comes first:

<!-- 1. Configuration FIRST -->
<script>
  window.notedisConfig = { /* ... */ };
</script>

<!-- 2. Widget script SECOND -->
<script src="https://notedis.com/js/widget.js" defer></script>

"Cannot read property of undefined"

Cause: Widget trying to access DOM elements before page loads.

Fix: Widget already uses defer attribute. If still having issues:

<script src="https://notedis.com/js/widget.js" defer></script>

Make sure defer is present.

CSP (Content Security Policy) errors

Symptoms: Console shows CSP violation errors.

Fix: Update your CSP headers to allow Notedis:

Content-Security-Policy:
  script-src 'self' https://notedis.com https://cdn.jsdelivr.net;
  connect-src 'self' https://notedis.com;
  img-src 'self' https://notedis.com data:;

Mobile Issues

Widget not working on mobile devices

Solutions:

  1. Viewport issues
    • Ensure your site has proper viewport meta tag:
<meta name="viewport" content="width=device-width, initial-scale=1">
  1. Touch events
    • Widget supports touch events by default
    • Try tapping (not clicking) on mobile
  2. Mobile browser compatibility
    • Works on iOS Safari, Chrome, Firefox
    • Android Chrome, Firefox, Samsung Internet

Screenshot not working on iOS

Known limitation: iOS Safari has restrictions on screenshot capture for security reasons.

Workaround: Users can upload photos instead of using automatic screenshot.

Performance Issues

Widget slowing down my site

Symptoms: Page loads slower after adding widget.

Not likely, but solutions:

  1. Check PageSpeed scores
    • Widget loads asynchronously with defer
    • Should have minimal impact
    • Test before/after with PageSpeed Insights
  2. CDN issues
    • Notedis uses global CDN for fast delivery
    • If CDN is slow in your region, contact support
  3. Large screenshots
    • Screenshots are compressed before upload
    • Check network tab for upload sizes

Email & Notification Issues

Not receiving notification emails

Solutions:

  1. Check spam folder
    • Notedis emails may be marked as spam initially
    • Mark as "Not Spam" to whitelist
  2. Email settings
    • Verify notification settings in profile
    • Ensure email notifications enabled
  3. Email verification
    • Verify your email address
    • Check for verification email in inbox/spam
  4. Whitelist our domain
    • Add @notedis.com to contacts
    • Add to email whitelist/allowlist

Account & Billing Issues

Can't access workspace

Solutions:

  1. Check workspace selection
    • Use workspace switcher in dashboard
    • Ensure you're in correct workspace
  2. Invitation not received
    • Check spam folder
    • Ask workspace owner to resend
  3. Permissions
    • Verify your role in workspace
    • Contact workspace owner

Billing or subscription issues

Solutions:

  1. Payment failed
    • Update payment method in billing settings
    • Check with your bank/card provider
  2. Subscription status

Still Having Issues?

If none of these solutions work:

  1. Check browser console
    • Press F12 to open DevTools
    • Go to Console tab
    • Copy any error messages
  2. Take screenshots
    • Screenshot of issue
    • Screenshot of browser console
    • Screenshot of network tab (if submission fails)
  3. Contact support
    • Email: [email protected]
    • Include:
      • Site URL where widget is installed
      • Browser and version
      • Steps to reproduce issue
      • Error messages from console
      • Screenshots

We typically respond within 24 hours (often much faster). Pro customers get priority support.

Useful Debug Commands

Open browser console (F12) and run:

// Check if widget loaded
console.log(window.notedisWidget);

// Check configuration
console.log(window.notedisConfig);

// Manually open widget
window.notedisWidget?.open();

// Check for JavaScript errors
// (Look for red error messages in console)

Browser Console Shortcuts

  • Windows/Linux: F12 or Ctrl+Shift+I
  • Mac: Cmd+Option+I
  • View Console tab: Click "Console" at top
  • View Network tab: Click "Network" at top
  • Clear console: Click 🚫 icon or type clear()

Related Documentation

TeamFAQ