✨ How to Add a Simple Feedback Widget to Your Site with Google Tag Manager

Collecting customer feedback shouldn't be complicated. In this guide, I'll show you how to install a clean, non-intrusive feedback widget on any website using Google Tag Manager (GTM) β€” no developers required.

This little widget pops up in the bottom-right corner and asks a simple question:

β€œWould you like to answer a few quick questions to help us improve?”

The user can say β€œYes”, opening your survey, or click β€œMaybe later”, and the prompt won’t appear again (thanks to localStorage). You can link it to any feedback tool you like β€” Google Forms, Typeform, Tally, or anything else.

🧰 What You’ll Need

  • A Google Tag Manager container installed on your site
  • A URL to your feedback form (e.g. Google Form, Typeform, Tally.so)
  • 5 minutes of time

πŸ§ͺ 1. Copy the Feedback Widget Script

Update the form link in the code below:

<script>
(function () {
  // Snippet by Net Impression
  // Resources: https://www.netimpression.co.uk/free-resources
  // Contact:   https://www.netimpression.co.uk/contact

  // === Customisable survey URL ===
  var FEEDBACK_URL = 'https://your-feedback-form-link.com'; // <- change this!

  // === Check if previously dismissed ===
  if (localStorage.getItem('feedbackWidgetDismissed') === 'true') return;

  // === Styles for animation and layout ===
  var style = document.createElement('style');
  style.innerHTML =
    '#feedback-widget { animation: slideInUp 0.5s ease-out; }' +
    '@keyframes slideInUp { from { transform: translateY(100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }' +
    '.feedback-button { display: inline-block; padding: 8px 14px; margin-right: 8px; border-radius: 4px; font-size: 13px; text-decoration: none; cursor: pointer; }' +
    '.feedback-yes { background-color: #4a90e2; color: white; border: none; }' +
    '.feedback-maybe { background-color: #e0e0e0; color: #333; border: none; }' +
    '.feedback-close { position: absolute; top: 8px; right: 12px; background: none; border: none; font-size: 18px; font-weight: bold; cursor: pointer; }';
  document.head.appendChild(style);

  // === Widget HTML ===
  var widget = document.createElement('div');
  widget.innerHTML =
    '<div id="feedback-widget" style="' +
    'position: fixed; bottom: 0; right: 30px; width: 300px; background: #fff; border: 2px solid #8b95a1;' +
    'border-bottom: none; border-top-left-radius: 8px; border-top-right-radius: 8px; box-shadow: 0 -2px 10px rgba(0,0,0,0.1);' +
    'font-family: Arial, sans-serif; z-index: 2147483647;">' +
    '<a href="https://www.netimpression.co.uk/" target="_blank" style="display: block; padding: 8px 16px 0;">' +
    '<img src="https://i.imgur.com/NQpOuVP.png" alt="Net Impression Logo" style="max-width: 120px; height: auto;" />' +
    '</a>' +
    '<button class="feedback-close" aria-label="Close">Γ—</button>' +
    '<div style="padding: 16px; padding-top: 8px;">' +
    '<p style="margin: 0 0 12px; font-size: 14px; color: #333;">Help us improve! Would you like to answer a few quick questions?</p>' +
    '<div>' +
    '<button class="feedback-button feedback-yes">Yes</button>' +
    '<button class="feedback-button feedback-maybe">Maybe later</button>' +
    '</div>' +
    '</div>' +
    '</div>';
  document.body.appendChild(widget);

  // === Button logic ===
  widget.querySelector('.feedback-close').addEventListener('click', function () {
    localStorage.setItem('feedbackWidgetDismissed', 'true');
    widget.parentNode.removeChild(widget);
  });

  widget.querySelector('.feedback-yes').addEventListener('click', function () {
    window.open(FEEDBACK_URL, '_blank');
    localStorage.setItem('feedbackWidgetDismissed', 'true');
    widget.parentNode.removeChild(widget);
  });

  widget.querySelector('.feedback-maybe').addEventListener('click', function () {
    localStorage.setItem('feedbackWidgetDismissed', 'true');
    widget.parentNode.removeChild(widget);
  });

  // Credit
  console.log('Code on this page was developed by www.netimpression.co.uk πŸš€');
})();
</script>

‍

🧩 2. Add the Script to Google Tag Manager

  1. Go to Google Tag Manager
  2. Click Tags β†’ New
  3. Choose Tag Type: Custom HTML
  4. Paste the code above into the HTML box
  5. Set the trigger to All Pages (or target specific URLs)
  6. Click Save, then Submit and Publish

That’s it! The widget is now live on your site πŸŽ‰

βœ… What the Widget Does

πŸ“‹ Recommended Feedback Tools

Here are a few great free options that you can link to:

Table of feedback form tools

‍

Just create your form, copy the share URL, and paste it into the FEEDBACK_URL line in the script.

πŸš€ Pro Tips

‍

Not sure where to start?

Whether you need to fix your tracking, improve your reporting, or run better experiments, we help businesses of all sizes turn analytics and CRO into a real growth engine. Get in touch to see how better data and faster testing can accelerate your results.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.