Skip to main content

Installing AllAccessible on Drupal

AllAccessible offers a dedicated Drupal module that adds the accessibility widget to your site and connects it to your AllAccessible account. Once ins

Written by Frank

Installing AllAccessible on Drupal

Overview

AllAccessible offers a dedicated Drupal module that adds the accessibility widget to your site and connects it to your AllAccessible account. Once installed and configured with your account, the widget loads on every page automatically and AllAccessible's agentic AI adjustments begin working in the background. This guide covers installing the module, connecting your account, and a manual snippet fallback if you prefer not to use the module.

Who This Is For

  • Site owners and developers running Drupal 10 or Drupal 11

  • Teams that manage their own Drupal modules

  • Anyone who prefers a native module over pasting code

What You'll Learn

  • How to install and enable the AllAccessible Drupal module

  • How to connect the module to your AllAccessible account

  • A manual snippet alternative for any Drupal theme

  • How to verify the widget is live


Before You Start

Requirements:

  • βœ… A Drupal 10 or Drupal 11 site

  • βœ… Administrator access (permission to administer site configuration)

  • βœ… An AllAccessible account, or the email you want to use to create one

Module details:

  • Module name: AllAccessible

  • Version: 1.3.3

  • Compatibility: Drupal 10 and Drupal 11

  • Package: Accessibility

Time Required: About 10 minutes


Step 1: Install the AllAccessible Module

  1. Download the AllAccessible module archive.

  2. Extract the archive so you have the all_accessible folder.

  3. Place the all_accessible folder into your Drupal site's modules/custom directory (or web/modules/custom, depending on your site's structure).

  4. In your Drupal admin, go to the Extend page (/admin/modules).

  5. Find AllAccessible and enable it.

πŸ“· AllAccessible listed on the Drupal Extend page, ready to enable


Step 2: Connect Your AllAccessible Account

  1. In the Drupal admin, go to Configuration β†’ Web services β†’ AllAccessible Settings (/admin/config/services/all_accessible).

  2. Enter the email address associated with your AllAccessible account. If you don't have an account yet, enter the email you'd like to use β€” submitting the form can create and connect your site.

  3. If you already have an Account ID, you can enter it here as well.

  4. Click Save to activate.

Once your account is connected, the module injects the widget into every page automatically β€” there's no snippet to paste.

πŸ“· AllAccessible Settings form in Drupal with email and account fields

Note on the settings location: The AllAccessible Settings page lives under Configuration β†’ Web services. Some older documentation references a different path; use the Web services location above.


Step 3: Verify the Widget Is Live

  1. Visit a public page on your Drupal site (not the admin area).

  2. Look for the accessibility button, by default in the bottom-right corner.

  3. Click it to open the accessibility menu and try a control, such as increasing text size.

If the button doesn't appear, clear Drupal's cache (Configuration β†’ Development β†’ Performance β†’ Clear all caches), then hard-refresh your browser.


Alternative: Manual Snippet (Any Drupal Theme)

If you'd rather not use the module, you can add AllAccessible with the universal JavaScript snippet. This works on any Drupal version and any theme.

  1. In your AllAccessible dashboard, open the How to Install AllAccessible page and copy your Account ID and the install snippet.

  2. Add the snippet to your site's HTML head β€” for example, in your theme's html.html.twig template, or through a "custom HTML head" module/block that outputs into the page <head>.

  3. Clear Drupal's cache and reload a public page.

<script>
(function(d) {
    var s = d.createElement("script");
    s.setAttribute("data-accessible-account-id", "YOUR_ACCOUNT_ID");
    s.setAttribute("id", "allAccessibleWidget");
    s.async = true;
    s.setAttribute("src", "https://api.allaccessible.org/widget/YOUR_ACCOUNT_ID.js");
    d.head.appendChild(s);
})(document)
</script>

Replace YOUR_ACCOUNT_ID with the Account ID shown in your dashboard.


Troubleshooting

Widget doesn't appear after enabling the module

  • Confirm you entered your account email on the AllAccessible Settings page and clicked Save.

  • Clear all Drupal caches, then hard-refresh (Cmd+Shift+R / Ctrl+Shift+R).

  • Make sure you're viewing a public page, not the admin theme.

Installed but no data in your dashboard

Confirm the email or Account ID on the settings page matches your AllAccessible account. If it still doesn't connect, contact support with your site URL and Account ID.

Module not visible on the Extend page

Double-check that the all_accessible folder is in a modules directory Drupal scans (modules/custom or web/modules/custom) and that file permissions allow Drupal to read it.


Frequently Asked Questions

Q: Which Drupal versions are supported?
A: The module supports Drupal 10 and Drupal 11.

Q: Do I need an Account ID before installing?
A: No. You can enter your email on the settings page and let the module connect (or create) your site. If you already have an Account ID, you can enter it directly.

Q: Do I have to add code to my theme?
A: Not with the module β€” it injects the widget automatically. The manual snippet is only for people who prefer not to use the module.

Q: Can I customize the widget after installing?
A: Yes. Appearance, position, colors, and behavior are managed in Widget Settings in your AllAccessible dashboard.


Related Articles


Last Updated: July 2026
​Installation Method: Drupal Module (v1.3.3) or manual snippet
​Difficulty: Intermediate

Did this answer your question?