NinjaSCAN.ai Accessibility Widget Integration Guide

This guide walks you through every step to add the NinjaSCAN.ai Accessibility Widget to your website. Log in to your NinjaSCAN.ai Web Admin Panel (your account dashboard) to get the script snippet, then paste it in the right place—no coding expertise required!

What You'll Need

  • Your website's admin access or ability to edit template files.
  • A text editor or the built-in editor in your CMS.
  • Access to your NinjaSCAN.ai account (Web Admin Panel) to get the widget script snippet.

Quick Start: Global Template Insertion

Ideal if your site uses a shared header or footer template.

  1. Locate the shared template
    • Common names: header.php, footer.php, theme.liquid, layout.html.
    • In your CMS, look for "Theme Editor," "Layout," or "Templates."
  2. Paste the snippet
    • Insert the <script> tag just before the closing </head> tag for best performance.
    • Alternatively, place it right before </body> if you prefer loading after content.
  3. Save and publish
    • Save changes in your editor.
    • Clear any caches (if applicable).
  4. Verify
    • Open your site in a browser and look for the widget icon.
    • Use Developer Tools (Console) to confirm the script loaded without errors.

Platform-Specific Instructions

WordPress

Via Theme Editor

  1. In Admin, go to Appearance > Theme File Editor.
  2. Select header.php (or the file containing <head>).
  3. Paste the snippet before </head> and Update File.

Via Plugin

  1. Install Insert Headers and Footers or a similar plugin.
  2. Go to Settings > Insert Headers and Footers.
  3. Paste the script into Scripts in Header and save.

Via functions.php

function add_ninjascan_widget() {
  echo '<!-- Paste your NinjaSCAN.ai script snippet here -->';
}
add_action('wp_head', 'add_ninjascan_widget');

Shopify

  1. In Shopify Admin, go to Online Store > Themes.
  2. Click Actions > Edit Code on your live theme.
  3. Under Layout, open theme.liquid.
  4. Paste the snippet before </head>, then Save.

Static HTML Sites

  1. Open each .html file in your editor.
  2. Paste the <script> snippet in the <head> section of each page.
  3. Save and upload back to your server.

Other CMS (Drupal, Joomla, etc.)

  • Look for a Global Header/Footer or Custom Code section in site settings.
  • Paste the snippet into the header area.
  • Save and clear caches.

Google Tag Manager

  1. Log in to Google Tag Manager.
  2. Create a New Tag → Custom HTML.
  3. Paste the NinjaSCAN.ai snippet into the HTML box.
  4. Set Trigger to All Pages and save.
  5. Publish your workspace.

What If There's No Shared Template?

If your website doesn't have a global template (e.g., hand-coded pages without includes), you can manually insert the snippet on each page:

  • Open every HTML file and paste the snippet in the <head>.
  • Quick for small sites (under ~10 pages).

Tip: If you're not comfortable editing many pages, consider using a simple site builder or ask your hosting support for a basic include mechanism.

Verifying Installation

  1. Open your website in a browser.
  2. Right-click → Inspect Element or Developer Tools.
  3. Go to the Console or Network tab and search for ninjascan-widget.js.
  4. Confirm the file loads without errors.
  5. Ensure the widget icon appears on every page.

Thank you for choosing NinjaSCAN.ai! Together, we make the web accessible for everyone.