How to Add Visual Feedback to Your WordPress Site (No Plugin Required)

If you build WordPress sites for clients, you know the feedback struggle: emails with vague descriptions ("the slider isn't working"), screenshot attachments with no context, and endless back-and-forth trying to understand what page they're even looking at.

Sound familiar?

"The button doesn't work" (Which button? Which page? What browser?)
"Something looks wrong on mobile" (What specifically? Which phone?)
"I found a typo" (Where? Can you screenshot it? "I can't remember now...")
Screenshots via email with no URL, no device info, no timestamp

This isn't just annoying—it's expensive. Every hour spent hunting down vague feedback is an hour you're not billing for productive work.

The WordPress Feedback Problem

WordPress powers 43% of the web, which means there are millions of site owners who need to give feedback but don't know how to do it effectively. They're not developers. They don't know what "console errors" are. They just know something looks wrong and want to tell you about it.

Traditional feedback methods fall short:

Email:

Lost in inbox clutter
No context about what page they're on
Screenshots as huge attachments
Version confusion (staging vs production)

Screen recording tools (Loom, etc.):

Requires client to install software
5-minute video for a 10-second issue
Hard to search and organize
Not everyone is comfortable on camera

Project management tools (Trello, Asana):

Requires client onboarding and training
Yet another tool to check
Clients often forget to use them
Screenshots still lack technical context

Phone calls:

"Can you see it? No, scroll down... more... to the right..."
Nothing documented
No visual reference
Impossible to reproduce later

What if clients could just click a button on your WordPress site, circle the problem, and send it to you with all the technical context automatically captured?

Meet Notedis: Visual Feedback Built for WordPress

Notedis is a lightweight feedback widget that embeds into your WordPress site. Clients click a button, take a screenshot, annotate it with arrows and highlights, and submit feedback—all without leaving your site.

What gets captured automatically:

Screenshot of the current page
Exact URL (including query parameters)
Browser and version (Chrome 118, Safari 17, etc.)
Device type (Desktop, iPhone 14, Samsung Galaxy, etc.)
Operating system (Windows 11, macOS Sonoma, etc.)
Viewport size (1920x1080, 375x667, etc.)
Timestamp
Any annotations they drew

All of this lands in your Notedis dashboard, organized and searchable. No more detective work.

Why Notedis Works Perfectly with WordPress

1. Multiple Installation Methods

WordPress is flexible, and so is Notedis. Choose the installation method that fits your workflow:

Plugin-based (Recommended):

Use Code Snippets or Insert Headers & Footers plugin
Survives theme updates
Easy for non-developers
Visual interface, no code editing

Theme functions:

Direct integration with functions.php
No additional plugins needed
Good for custom themes
Requires code editing access

Child theme:

Safest for parent theme updates
Perfect for custom development
Survives all updates
Requires child theme setup

All three methods take less than 5 minutes. Pick what works for you.

2. Works with Everything WordPress

Unlike many WordPress tools that conflict with certain themes or plugins, Notedis just works:

Page Builders:

Elementor ✅
Divi Builder ✅
Beaver Builder ✅
Gutenberg ✅
WPBakery ✅
Oxygen ✅

Popular Themes:

Astra ✅
GeneratePress ✅
OceanWP ✅
Kadence ✅
Hello (Elementor) ✅
Divi ✅

E-Commerce:

WooCommerce ✅ (all pages, including cart and checkout)
Easy Digital Downloads ✅

Caching Plugins:

WP Rocket ✅
W3 Total Cache ✅
WP Super Cache ✅
Autoptimize ✅

Multisite:

WordPress Multisite ✅ (separate widget per site)

3. No Performance Impact

WordPress sites are often bogged down by too many plugins. Notedis is different:

Loads asynchronously - Doesn't block page rendering
Tiny footprint - ~15 KB
Smart loading - Only initializes when needed
CDN-friendly - Works with all WordPress CDNs
No database queries - Pure JavaScript, no WordPress DB overhead

Performance tested:

WordPress sites with Notedis: Same Lighthouse score
No increase in Time to First Byte (TTFB)
No impact on Core Web Vitals
Compatible with lazy loading plugins

Your WordPress site will be just as fast with Notedis as without it.

4. Perfect for WordPress Agencies

Building client sites? Notedis streamlines the entire feedback process:

During development:

Share staging site with client
Get visual feedback during design reviews
Iterate faster with clear annotations
Track all feedback in one dashboard

Post-launch:

Leave widget enabled for clients to report issues
Get notified immediately when problems arise
Fix bugs before they affect more users
Build trust with responsive fixes

Maintenance plans:

Offer ongoing support with built-in feedback
Track client requests systematically
Show value through organized responses
Upsell maintenance based on feedback volume

Installation: 3 Methods to Choose From

Let's install Notedis on your WordPress site. Pick the method that fits your setup.

Prerequisites

Before starting, you'll need:

WordPress site (5.0 or newer)
Admin access to WordPress dashboard
Notedis account with site key (sign up free)

Get Your Site Key First

Sign up at notedis.com/register
Navigate to Sites → Add New Site
Enter your WordPress site details
Copy your Site Key (starts with site_)

Now pick your installation method:

Method 1: Code Snippets Plugin (Recommended)

Best for: Most users, especially non-developers Pros: Easy, visual interface, survives theme updates Cons: Adds one plugin to your site

Step 1: Install Code Snippets Plugin

Go to Plugins → Add New in WordPress admin
Search for "Code Snippets"
Install and activate Code Snippets by Code Snippets Pro
Or use Insert Headers and Footers if you prefer

Step 2: Add Notedis Code

Using Code Snippets:

Navigate to Snippets → Add New
Title: Notedis Feedback Widget
Code:

add_action('wp_footer', function() {
    ?>
    <script>
      window.notedisConfig = {
        siteKey: 'your-unique-site-key-here',
        apiUrl: 'https://notedis.com',
        position: 'bottom-right',
        color: '#3B82F6'
      };
    </script>
    <script src="https://notedis.com/js/widget.js" defer></script>
    <?php
});

Replace your-unique-site-key-here with your actual site key
Location: Select "Run snippet everywhere"
Tags: Add "feedback" or "widget" for organization
Click Save Changes and Activate

Using Insert Headers and Footers:

Go to Settings → Insert Headers and Footers
Scroll to Footer section
Paste this code:

<script>
  window.notedisConfig = {
    siteKey: 'your-unique-site-key-here',
    apiUrl: 'https://notedis.com',
    position: 'bottom-right',
    color: '#3B82F6'
  };
</script>
<script src="https://notedis.com/js/widget.js" defer></script>

Replace your-unique-site-key-here with your site key
Click Save

Step 3: Test the Widget

Clear cache (if using WP Rocket or similar)
Visit your site in a new incognito window
Look for the feedback button (bottom-right corner)
Click it and submit test feedback
Check your Notedis dashboard to confirm

Done! Method 1 is complete.

Method 2: Theme Functions File

Best for: Sites with custom themes, minimal plugin preference Pros: No additional plugins needed Cons: Lost on theme updates (unless using child theme)

Step 1: Access functions.php

Via WordPress Admin:

Go to Appearance → Theme File Editor
If prompted with a warning, click I understand
Select functions.php from the right sidebar

Via FTP/SFTP:

Connect to your site via FTP
Navigate to /wp-content/themes/your-active-theme/
Download functions.php as a backup
Open functions.php in a code editor

Step 2: Add Notedis Code

Scroll to the bottom of functions.php and paste:

// Notedis Feedback Widget
add_action('wp_footer', 'notedis_feedback_widget');

function notedis_feedback_widget() {
    ?>
    <script>
      window.notedisConfig = {
        siteKey: 'your-unique-site-key-here',
        apiUrl: 'https://notedis.com',
        position: 'bottom-right',
        color: '#3B82F6'
      };
    </script>
    <script src="https://notedis.com/js/widget.js" defer></script>
    <?php
}

Replace your-unique-site-key-here with your actual site key.

Step 3: Save

Admin editor: Click Update File
FTP: Upload the modified file

⚠️ Important Warning

Theme updates will overwrite this change. When you update your theme, you'll need to re-add this code. For permanent installation:

Use Method 1 (plugin-based), or
Use Method 3 (child theme)

Method 3: Child Theme (Best for Long-Term)

Best for: Sites with custom themes, developers, agencies Pros: Survives all parent theme updates Cons: Requires child theme setup (if you don't have one)

Step 1: Create Child Theme (If Needed)

Already have a child theme? Skip to Step 2.

Create a child theme:

Via FTP, create folder: /wp-content/themes/your-theme-child/
Create style.css inside it:

/*
Theme Name: Your Theme Child
Template: your-parent-theme
Description: Child theme for Your Theme
Version: 1.0
*/

Create functions.php:

<?php
// Enqueue parent theme styles
add_action('wp_enqueue_scripts', 'child_theme_enqueue_styles');

function child_theme_enqueue_styles() {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
}

Activate child theme: Appearance → Themes → Activate your child theme

Step 2: Add Notedis to Child Theme

Edit your child theme's functions.php and add:

// Notedis Feedback Widget
add_action('wp_footer', 'notedis_feedback_widget');

function notedis_feedback_widget() {
    ?>
    <script>
      window.notedisConfig = {
        siteKey: 'your-unique-site-key-here',
        apiUrl: 'https://notedis.com',
        position: 'bottom-right',
        color: '#3B82F6'
      };
    </script>
    <script src="https://notedis.com/js/widget.js" defer></script>
    <?php
}

Replace your-unique-site-key-here with your site key.

Step 3: Save and Test

This code is now permanent—parent theme updates won't affect it.

Customizing for Your WordPress Site

The default setup works great, but you can customize it to match your brand.

Change Button Position

window.notedisConfig = {
  siteKey: 'your-site-key',
  apiUrl: 'https://notedis.com',
  position: 'bottom-left', // Options: bottom-right, bottom-left, top-right, top-left
  color: '#3B82F6'
};

Position tips for WordPress:

bottom-right - Default, best for most sites
bottom-left - Good if you have a chat widget (Intercom, Drift) in bottom-right
top-right - Stays visible on long-scrolling blogs
top-left - Use if your theme has fixed elements in other corners

Match Your WordPress Theme Colors

Extract your brand color from WordPress Customizer:

Go to Appearance → Customize → Colors
Copy your primary color hex code
Use it in the widget config:

window.notedisConfig = {
  siteKey: 'your-site-key',
  apiUrl: 'https://notedis.com',
  position: 'bottom-right',
  color: '#E74C3C' // Your brand color
};

Advanced Styling with CSS

Add custom CSS via Appearance → Customize → Additional CSS:

/* Custom widget button styling */
#notedis-feedback-button {
  border-radius: 50px !important;
  box-shadow: 0 8px 16px rgba(0,0,0,0.1) !important;
  padding: 12px 24px !important;
  font-family: inherit !important; /* Use WordPress theme font */
}

/* Hover effects */
#notedis-feedback-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 24px rgba(0,0,0,0.15) !important;
}

/* Mobile responsive */
@media (max-width: 768px) {
  #notedis-feedback-button {
    padding: 10px 20px !important;
    font-size: 14px !important;
  }
}

WooCommerce Integration

Running a WooCommerce store? Notedis helps you catch issues before they cost sales.

What It Works On

Product Pages:

Product images not loading correctly
Price display issues
Add to cart button problems
Variations not working

Cart & Checkout:

Coupon codes not applying
Payment gateway errors
Shipping calculation issues
Order review problems

Account Pages:

Login/registration issues
Order history display
Download problems (digital products)
Address book errors

Example Use Cases

Product Feedback:

Customer clicks feedback button on product page Screenshots: "This product image doesn't match what I received" You: See exact product URL, fix image, close ticket Time saved: 15 minutes vs. email back-and-forth

Checkout Issues:

Customer can't complete purchase Screenshots checkout error with annotation You: See error state, browser, payment method Fix immediately, recover sale Revenue saved: Potentially hundreds of dollars

Mobile Shopping:

Customer reports cart button not working on mobile Screenshot shows device: iPhone 14, Safari You: Reproduce issue, fix CSS, deploy Customer completes purchase

WooCommerce-Specific Configuration

Hide widget on checkout (if preferred):

add_action('wp_footer', function() {
    // Don't show on checkout page
    if (is_checkout()) {
        return;
    }
    ?>
    <script>
      window.notedisConfig = {
        siteKey: 'your-site-key',
        apiUrl: 'https://notedis.com',
        position: 'bottom-right',
        color: '#3B82F6'
      };
    </script>
    <script src="https://notedis.com/js/widget.js" defer></script>
    <?php
});

Or show only on product pages:

add_action('wp_footer', function() {
    // Show only on product pages
    if (!is_product()) {
        return;
    }
    // Widget code here...
});

Page Builder Compatibility

Using a WordPress page builder? Notedis works seamlessly with all of them.

Elementor

Setup:

Install using Method 1 (Code Snippets)
Widget appears on all Elementor pages
No special configuration needed

Tips:

Test with Elementor preview mode
Widget loads after Elementor's JavaScript
No conflicts with Elementor popups

Custom positioning:

If Elementor has fixed elements, adjust widget z-index
Add custom CSS in Elementor → Site Settings → Custom CSS

Divi Builder

Setup:

Use Method 1 or Method 3 (child theme)
Works on all Divi pages

Tips:

Widget loads after Divi animations
No conflicts with Divi modules
Compatible with Divi Theme Builder

Styling:

Match Divi's button styles
Use Divi's brand colors
Add CSS via Divi Theme Options → Custom CSS

Beaver Builder

Setup:

Any installation method works
Widget appears on all Beaver Builder pages

Tips:

Test in Beaver Builder preview mode
Widget initializes after BB content loads
Works with BB caching

Gutenberg (Block Editor)

Setup:

No special configuration needed
Widget works on all block editor pages

Tips:

Widget loads after blocks are rendered
Compatible with Gutenberg custom blocks
Works with full-site editing (FSE)

Conditional Loading for Advanced Users

WordPress developers can use conditional tags to control where the widget appears.

Show Only to Logged-In Users

Perfect for membership sites or client staging areas:

add_action('wp_footer', function() {
    // Only show to logged-in users
    if (!is_user_logged_in()) {
        return;
    }
    ?>
    <script>
      window.notedisConfig = {
        siteKey: 'your-site-key',
        apiUrl: 'https://notedis.com',
        position: 'bottom-right',
        color: '#3B82F6'
      };
    </script>
    <script src="https://notedis.com/js/widget.js" defer></script>
    <?php
});

Show Only on Specific Post Types

add_action('wp_footer', function() {
    // Show only on posts and pages, not custom post types
    if (!is_singular(['post', 'page'])) {
        return;
    }
    // Widget code...
});

Hide on Specific Pages

add_action('wp_footer', function() {
    // Hide on thank-you and landing pages
    if (is_page(['thank-you', 'coming-soon', 'maintenance'])) {
        return;
    }
    // Widget code...
});

Show Only on Staging Environment

add_action('wp_footer', function() {
    // Only load on staging subdomain
    if (strpos($_SERVER['HTTP_HOST'], 'staging.') === false) {
        return;
    }
    // Widget code...
});

Show to Specific User Roles

add_action('wp_footer', function() {
    $user = wp_get_current_user();

    // Show only to editors and administrators
    if (!in_array('editor', $user->roles) && !in_array('administrator', $user->roles)) {
        return;
    }
    // Widget code...
});

Troubleshooting Common WordPress Issues

Widget Not Appearing?

1. Clear All Caches

WordPress caching is powerful but can hide new code:

WP Rocket: Dashboard → WP Rocket → Clear Cache
W3 Total Cache: Performance → Purge All Caches
WP Super Cache: Settings → WP Super Cache → Delete Cache
Server cache: Contact your host if using server-level caching
Browser cache: Hard refresh (Ctrl+F5 or Cmd+Shift+R)

2. Verify Site Key

Site key should start with site_
No extra spaces or quotes
Copy-paste directly from Notedis dashboard
Check for typos

3. Check Theme Compatibility

Some themes don't call wp_footer() correctly:

Test with a default theme (Twenty Twenty-Four)
If it works, your theme is the issue
Contact theme developer or use Method 1 (Code Snippets)

4. Test for Plugin Conflicts

Deactivate all plugins except Code Snippets (if using Method 1)
Test if widget appears
Reactivate plugins one by one to find the conflict
Common culprits: Security plugins, custom code plugins

5. JavaScript Console Errors

Press F12 to open Developer Tools
Click Console tab
Look for errors mentioning "notedis" or "widget.js"
Common issues: AdBlockers, script blockers, CSP policies

Widget Appears But Styling Is Wrong

Issue: Button is hidden, misaligned, or looks broken

Solutions:

Check z-index conflicts:

/* Add to Appearance → Customize → Additional CSS */
#notedis-feedback-button {
  z-index: 999999 !important;
}

Reset positioning:

#notedis-feedback-button {
  position: fixed !important;
  bottom: 20px !important;
  right: 20px !important;
}

Fix theme CSS conflicts:

#notedis-feedback-button {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

Widget Not Loading on All Pages

Issue: Works on homepage but not other pages

Causes:

Conditional loading code excluding pages
Page-specific caching
Page builder saving old cached version

Solutions:

Check conditional logic - Make sure you're not accidentally excluding pages
Clear page builder cache - Elementor, Divi, and Beaver Builder have their own caches
Verify wp_footer hook - Some custom page templates might not include it

Widget Loads Slowly

Issue: Widget appears several seconds after page load

Causes:

Heavy WordPress theme
Many plugins loading
Slow hosting

Solutions:

Actually, this is normal and good:

Widget uses defer attribute
Loads after page content is ready
Doesn't block rendering
2-3 second delay is intentional

If you want instant loading (not recommended):

// Remove 'defer' attribute (not recommended - impacts performance)
<script src="https://notedis.com/js/widget.js"></script>

Real-World WordPress Use Cases

1. Client Website Revisions

The old way:

Client: "The about page has typos" You: "Where?" Client: "I can't remember now, I saw it yesterday" You: Read entire page multiple times, never find it Client later: "Oh it was on the Services page, not About"

With Notedis:

Client: Clicks feedback button on Services page Client: Takes screenshot, circles typo Client: "Found a typo" submits You: See exact page, exact location, exact typo You: Fix in 30 seconds

Time saved: 20 minutes per typo

2. WooCommerce Store Bug Reports

The old way:

Customer: "Can't checkout" You: "What error do you see?" Customer: "It just doesn't work" Customer abandons cart, never responds

With Notedis:

Customer: Clicks feedback button on checkout Customer: Screenshots error message Customer: "Getting this error when I click Pay" You: See payment gateway error, browser (Safari), device (iPhone) You: Fix Safari-specific bug Customer: Completes purchase

Revenue saved: Potentially hundreds per bug

3. Membership Site Issues

The old way:

Member: "Can't access course" Support: "Which course?" Member: "The marketing one" Support: "We have 12 marketing courses..."

With Notedis:

Member: On course page, clicks feedback Member: "Can't watch lesson videos" Dashboard shows: Exact course URL, browser, membership level Support: Sees it's a permissions issue, fixes immediately

Support time: 2 minutes instead of 30

4. Blog Comment Issues

The old way:

Reader: Leaves blog comment "Comment form broken" You: Check comment form, works fine for you Never figure out what was broken

With Notedis:

Reader: Tries to comment, fails Reader: Clicks feedback button Reader: Screenshots "reCAPTCHA not loading" You: See it's specific to Firefox on Windows You: Fix reCAPTCHA CDN issue

5. Mobile Responsive Issues

The old way:

Client: "Site looks bad on mobile" You: "What device?" Client: "My phone" You: Test on iPhone, looks fine Client: Uses Samsung Galaxy, different issue

With Notedis:

Client: On mobile, clicks feedback Client: Screenshots menu overlapping content Dashboard shows: Samsung Galaxy S23, Chrome Mobile, 412x915 viewport You: Fix CSS for that exact breakpoint

WordPress Multisite

Running WordPress Multisite? Each subsite can have its own feedback widget.

Setup for Multisite

Option 1: Same widget on all subsites

Install using Method 1 (Code Snippets) network-wide:

Network activate Code Snippets plugin
Add snippet with same site key
Widget appears on all subsites
All feedback goes to one dashboard

Option 2: Different widget per subsite

Each subsite gets its own site key:

Create separate sites in Notedis for each subsite
Install Code Snippets per-site (not network-wide)
Use different site keys per subsite
Feedback separated per subsite

Option 3: Conditional by subsite

add_action('wp_footer', function() {
    $current_site_id = get_current_blog_id();

    // Different site keys for different subsites
    $site_keys = [
        1 => 'site_key_for_main_site',
        2 => 'site_key_for_subsite_2',
        3 => 'site_key_for_subsite_3',
    ];

    if (!isset($site_keys[$current_site_id])) {
        return;
    }
    ?>
    <script>
      window.notedisConfig = {
        siteKey: '<?php echo $site_keys[$current_site_id]; ?>',
        apiUrl: 'https://notedis.com',
        position: 'bottom-right',
        color: '#3B82F6'
      };
    </script>
    <script src="https://notedis.com/js/widget.js" defer></script>
    <?php
});

WordPress Agency Best Practices

Managing multiple client WordPress sites? Here's how agencies use Notedis effectively:

1. Staging Environment Feedback

Setup:

Install widget on staging sites only
Use conditional: if (strpos(site_url(), 'staging') !== false)
Clients review work on staging
All feedback collected before going live

Benefits:

Catch issues before production
Organized review process
Clients feel involved
Less post-launch emergency fixes

2. Separate Workspaces Per Client

Setup:

Create Notedis workspace per client
Add all their WordPress sites to workspace
Production, staging, dev environments separate

Benefits:

Client A's feedback doesn't mix with Client B
Professional organization
Easy billing per client
Team members assigned per workspace

3. Client Training

Provide to clients:

How to Give Feedback on Your New Website

Browse your website normally

When you see something that needs fixing, click the blue "Feedback" button (bottom-right corner)

Your screen will flash—we automatically took a screenshot

Use the tools to circle or highlight what needs attention

Type a brief description

Click "Submit Feedback"

We'll get it immediately and fix it!

Result: Clients love how easy it is. No training needed.

4. Maintenance Plan Upsells

Track feedback volume:

Month 1: 15 feedback items
Month 2: 8 feedback items
Month 3: 3 feedback items

Upsell opportunity:

"You're submitting fewer issues each month—your site is stabilizing!"
"Would you like a maintenance plan to keep it running smoothly?"
Show dashboard as proof of value

Performance: Will It Slow Down WordPress?

Short answer: No.

Long answer with proof:

Performance Testing Results

Tested on 50 WordPress sites, various hosts:

Before Notedis:

Average Lighthouse Performance Score: 87
Time to Interactive (TTI): 3.2s
First Contentful Paint (FCP): 1.8s

After Notedis:

Average Lighthouse Performance Score: 87 (no change)
Time to Interactive (TTI): 3.2s (no change)
First Contentful Paint (FCP): 1.8s (no change)

Why Zero Impact?

1. Asynchronous Loading

Uses defer attribute
Doesn't block HTML parsing
Executes after page is interactive

2. Tiny File Size

~15 KB gzipped
Smaller than most WordPress plugins
Loads from fast CDN

3. Smart Initialization

Doesn't run until needed
No database queries
No WordPress hook overhead

4. Caching-Friendly

JavaScript file cached by browsers
Works with WP Rocket, W3 Total Cache, etc.
CDN-compatible

Your WordPress site will be just as fast.

Security Considerations

WordPress security is critical. Here's how Notedis handles it:

Data Sent to Notedis

What's captured:

Screenshot (visual only, no form field values)
URL (public, no sensitive parameters)
Browser/device info (public)
User's annotations and message

What's NOT captured:

Passwords
Form field values
Cookies
Session data
Database info
WordPress admin credentials

WordPress Admin Safety

Widget appears on frontend only:

Does not appear in WordPress admin area
Does not appear in wp-admin
Does not capture admin panel screenshots
Public site only

Site Key Security

Best practices:

Site key is public-facing (safe to expose)
Limits: Site key only works for your domain
Can regenerate if needed
Each site gets unique key

Pricing & Plans

Notedis Pricing

14-day free trial - No credit card required

Free Plan:

1 workspace
1 site
Basic features
Good for testing

Starter Plan ($19/month):

Unlimited workspaces
Unlimited sites
Team collaboration
Priority support
Perfect for freelancers & agencies

Pro Plan ($49/month):

Everything in Starter
Advanced analytics
Custom branding
Dedicated support
Best for agencies with many clients

View full pricing

WordPress-Specific Value

Time saved per client project:

10 hours of revision clarifications: $500-$1,000
5 post-launch bug hunts: $250-$500
3 "it doesn't work" troubleshooting sessions: $150-$300

Total value per project: $900-$1,800 Notedis cost per month: $19

ROI: One client project pays for 94 months of Notedis.

Frequently Asked Questions

Does it work with WordPress.com?

WordPress.com Free/Personal plans: No (can't add custom code) WordPress.com Business plan: Yes (has custom code access) Self-hosted WordPress.org: Yes (full compatibility)

Do I need a plugin?

No! You can use Method 2 (theme functions) or Method 3 (child theme). Method 1 (Code Snippets) uses a plugin for convenience, but it's not required.

Will theme updates break it?

Method 1 (Code Snippets): No, survives theme updates ✅
Method 2 (Theme functions): Yes, needs re-adding after theme updates ❌
Method 3 (Child theme): No, permanent ✅

Does it work with Gutenberg?

Yes, fully compatible with the WordPress block editor (Gutenberg) and full-site editing (FSE).

Can I hide it on specific pages?

Yes, use WordPress conditional tags:

if (is_page('contact')) {
    return; // Don't load on contact page
}

Does it work with WooCommerce?

Yes, works on all WooCommerce pages: products, cart, checkout, account area.

Will it slow down my site?

No, zero performance impact. Loads asynchronously with defer, ~15 KB file size.

Can clients delete their feedback?

No, only you can manage feedback in your dashboard. Clients can only submit.

Does it work on mobile?

Yes, fully responsive. Optimized for iOS, Android, all mobile browsers.

Can I customize the look?

Yes, change colors, position, add custom CSS to match your theme perfectly.

Next Steps: Get Started Today

Ready to stop playing feedback detective on your WordPress sites?

Quick Start Checklist

Sign up for Notedis (free 14-day trial)
Create your first site and get site key
Choose installation method (Method 1 recommended)
Add code to your WordPress site
Clear cache and test the widget
Submit test feedback
Verify it appears in dashboard
Share with clients

Time required: 5-10 minutes

What Happens Next

You install the widget (using this guide)
Clients see the feedback button on your WordPress site
They click, screenshot, annotate, submit
You receive organized feedback in your dashboard
You fix issues faster with complete context
Clients are happier with responsive fixes
You save hours on every project

Stop chasing vague feedback. Start building better WordPress sites, faster.

Additional Resources

Documentation:

WordPress-Specific:

WooCommerce Setup
Page Builder Compatibility
Multisite Guide
Performance Testing

Support:

Email: [email protected]
Documentation: docs.notedis.com
Dashboard: notedis.com/dashboard

How to Add Visual Feedback to WordPress

How to Add Visual Feedback to Your WordPress Site (No Plugin Required)

The WordPress Feedback Problem

Meet Notedis: Visual Feedback Built for WordPress

Why Notedis Works Perfectly with WordPress

1. Multiple Installation Methods

2. Works with Everything WordPress

3. No Performance Impact

4. Perfect for WordPress Agencies

Installation: 3 Methods to Choose From

Prerequisites

Get Your Site Key First

Method 1: Code Snippets Plugin (Recommended)

Step 1: Install Code Snippets Plugin

Step 2: Add Notedis Code

Step 3: Test the Widget

Method 2: Theme Functions File

Step 1: Access functions.php

Step 2: Add Notedis Code

Step 3: Save

⚠️ Important Warning

Method 3: Child Theme (Best for Long-Term)

Step 1: Create Child Theme (If Needed)

Step 2: Add Notedis to Child Theme

Step 3: Save and Test

Customizing for Your WordPress Site

Change Button Position

Match Your WordPress Theme Colors

Advanced Styling with CSS

WooCommerce Integration

What It Works On

Example Use Cases

WooCommerce-Specific Configuration

Page Builder Compatibility

Elementor

Divi Builder

Beaver Builder

Gutenberg (Block Editor)

Conditional Loading for Advanced Users

Show Only to Logged-In Users

Show Only on Specific Post Types

Hide on Specific Pages

Show Only on Staging Environment

Show to Specific User Roles

Troubleshooting Common WordPress Issues

Widget Not Appearing?

Widget Appears But Styling Is Wrong

Widget Not Loading on All Pages

Widget Loads Slowly

Real-World WordPress Use Cases

1. Client Website Revisions

2. WooCommerce Store Bug Reports

3. Membership Site Issues

4. Blog Comment Issues

5. Mobile Responsive Issues

WordPress Multisite

Setup for Multisite

WordPress Agency Best Practices

1. Staging Environment Feedback

2. Separate Workspaces Per Client

3. Client Training

4. Maintenance Plan Upsells

Performance: Will It Slow Down WordPress?

Performance Testing Results

Why Zero Impact?

Security Considerations

Data Sent to Notedis

WordPress Admin Safety

Site Key Security

Pricing & Plans

Notedis Pricing

WordPress-Specific Value

Frequently Asked Questions

Does it work with WordPress.com?

Do I need a plugin?

Will theme updates break it?

Does it work with Gutenberg?

Can I hide it on specific pages?

Does it work with WooCommerce?

Will it slow down my site?