How to install the accessibility widget in MODX

Modx plugin accessibility (opens in a new tab)

Plugin installation

Step 1: Register your site and obtain a token

If you are installing the plugin for the first time, register (opens in a new tab) using Google, Facebook or use your own email address and password. wcag register form After creating an account, go to the “My Sites” tab, and then click the button “Add new” (opens in a new tab). wcag my sites In the form for adding a new page, enter the addresses of the websites where you want to apply the token. If your site runs on a domain such as example .com and e.g. www. example.com then it is necessary to add both addresses. Read more about this in the documentation (opens in a new tab). Finally, click the "Save" button and copy the generated token. wcag copy token

Step 2: Adding the DockWCAG plugin in MODX

To add a plugin in MODX, go to the „Elements” tab, then „Plugins” and click the add plugin button.

modx add plugin (opens in a new tab)

Give a name e.g. „Assist For WCAG”, and in the Plugin Code (PHP) field paste the following code:

<?php

function loadAccessibility($token)
{
    $html = "<script>";
    $html .= "(function (d, s, t) {";
    $html .= "var f = d.getElementsByTagName(s)[0],";
    $html .= "j = d.createElement(s),";
    $html .= "a = new Date().getTime();";
    $html .= "j.async = true;";
    $html .= "j.src = '//wcag.dock.codes/accessibility/' + t + '/start.js'";
    $html .= "f.parentNode.insertBefore(j, f);";
    $html .= "})(document, 'script', '".urlencode($token)."');";
    $html .= "</script>";
    return $html;
}
$modx->regClientHTMLBlock(loadAccessibility('_TOKEN_'));

For more on how to configure the widget, see the documentation (opens in a new tab).

Paste code and replace _TOKEN_ with your unique token that was generated in the previous step.

modx onwebpageinit (opens in a new tab)

Finally, in the „System Events” tab, check „OnWebPageInit” and click „Save.”

Step 3: Preview the site

After adding the script, test your site to make sure the widget is properly installed and works as expected. Check all the widget’s functions to verify that the installation was successful.

 

Related posts

Still looking for answers?

Ask our experts using online chat

Contact us