Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

About

CKSource has created an Accessibility Checker that lets you inspect the accessibility level of content created in CKEditor and immediately solve any accessibility issues that are found.  This checker makes use of the QUAIL jQuery plugin (which is included).

...

CKSource also has a working demo of the Accessibility Checker on their website https://cksource.com/ckeditor/services#accessibility-checker 

 

Guide to installing CKSource Accessibility Checker Plugin

The CKSource Accessibility Checker Plugin is available commercially or as a GPL2 or GPL3 licensed work.  It is not available in a license that can be distributed alongside Sakai’s ECL2 license.  Individuals are free to combine these two great products for their use, just not for redistribution together.

...

CK Source can be contacted for a commercial version of the Accessibility Checker or for an open source version of the accessibility checker plugin via their website https://cksource.com/ckeditor/services#accessibility-checker 

 

A GPL-licenced version was distributed to Brock University on July 23, 2015 from CKSource.

Alternatively, the national government of the Netherlands provides a copy on their site http://gewoontoegankelijk.nl/node/14378 (labeled “The Accessibility Wizard”)

...

You will also need a copy of the balloonpanel plugin which can be obtained from http://ckeditor.com/addon/panel 

Step 2. Deploy

Deploy the zip files to webapps/library/editor/ckextraplugins/ by uncompressing all files in the archive "a11ychecker" and "balloonpanel" zip archives. The process should create a folder for both “a11ychecker” and “balloonpanel”.

...

  1. Edit the file a11ychecker/plugin.js

  2. At the top of the file add the following to ensure jQuery is always available

    Code Block
    languagejs
    function loadjQueryLibraries() {if (typeof(jQuery) === 'undefined') {CKEDITOR.scriptLoader.load('//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js', function() {jQuery.noConflict();})}}
    
  3. Search the (compressed) file for the text

     

    Code Block
    languagejs
    onLoad:function(){
    
    Replace this text with
    onLoad:function(){loadjQueryLibraries();
  4. Edit ckeditor.launch.js. Around line 110 add to the toolbar ['A11ychecker'],   For example
     

    Code Block
    languagejs
              ['A11ychecker'],
               '/',
               ['Styles','Format','Font','FontSize'],
  5. Around line 175 with other CKEDITOR.plugins.addExternal add:

    Code Block
    languagejs
          CKEDITOR.plugins.addExternal('a11ychecker',basePath+'a11ychecker/', 'plugin.js');
          CKEDITOR.plugins.addExternal('balloonpanel',basePath+'balloonpanel/', 'plugin.js');
  6. Around line 190 modify ckconfig.extraPlugins and add a11ychecker to the end so it may look like this:
     
     

    Code Block
    languagejs
              ckconfig.extraPlugins+="audiorecorder,movieplayer,wordcount,fmath_formula,a11ychecker";
    

 


Step 4. Refresh and Test

 The modified files are likely to be cached by web browsers.  User web browsers need to have their caches expire or naturally expire.

...