Nicolas Johnson

This plugin offers you the possibility to show people accessibility configurations in your menu. This means that everyone, including people with disabilities, will be able to configure the settings (contrast, font-size, coloration, …) that help them be able to use your website.
Here is a <a href="https://demo.wpinclusion.com/a11y-kit" rel="nofollow ugc">demo</a>. 
Follow the evolution of the plugin trough the <a href="https://github.com/multimedianj/a11y-kit" rel="nofollow ugc">Github repository</a>.
In order to make the plugin works, you need to create a menu first. 
In your menu, you simply need to add a CSS class in this way “wpak_DISABILITY_PROPERTY”.
Where to add the CSS class mentioned above ? 
– In the menu you’re in (Appearance > Menus > name_of_your_menu), you first click on an item you want to have the ability to change the state (accessibility menu item). 
– Then, you should have the field “CSS Classes (optional)”. Inside this field, you can add the class in this way : “wpak_DISABILITY_PROPERTY” (see examples from the pre-configured classes below). 
– If the field “CSS Classes (optional)” is not visible, you just have to look for the “Screen Options” button in the top-right corner of the page. Then, search for the checkbox “CSS Classes” which should be checked in order for the field to be visible. Finally, return to the field and add your class.
<h3>List of the pre-configured classes</h3>
<h4>Coloration</h4>
<ul>
<li>“wpak_color_normal” (normal state)</li>
<li>“wpak_color_dark” (dark mode)</li>
<li>“wpak_color_monochrome” (shades of gray, monochrome)</li>
<li>“wpak_color_highcontrast” (high contrast)</li>
<li>“wpak_color_lowsaturation” (low saturation)</li>
<li>“wpak_color_highsaturation” (high saturation)</li>
</ul>
<h4>Font size</h4>
<ul>
<li>“wpak_font_normal” (normal state)</li>
<li>“wpak_font_large” (large font-size, default: 30px)</li>
</ul>
<h4>Dyslexia</h4>
<ul>
<li>“wpak_dyslexia_normal” (normal state)</li>
<li>“wpak_dyslexia_comicsans” (Comic Sans font-family)</li>
<li>“wpak_dyslexia_arial” (Arial font-family)</li>
</ul>
<h4>Reset button</h4>
<ul>
<li>“wpakReset” (reset all the filters)</li>
</ul>
<h3>Add an icon instead of text</h3>
You can use the field for the title to add HTML code. With HTML code, it is possible to add 
– An image: <code><img src="link_of_your_image.png" alt="name_of_property" /></code> 
– An icon from FontAwesome or any library you want to include: <code></code>
<h3>Suggested FontAwesome icons</h3>
Here is a list of the suggested icons to use for each pre-configured accessibility settings.
<ul>
<li>Coloration: <code></code></li>
<li>Font-size: <code></code></li>
<li>Font-family: <code></code></li>
<li>Letter-spacing: <code></code></li>
<li>Line-height: <code></code></li>
<li>Reset button: <code></code></li>
</ul>
<h4>EXTRA</h4>
If you want to add a link to your accessibility statement page, we recommend using this icon that displays perfectly 
– <code></code>
<h3>Import a pre-generated menu</h3>
To import a pre-generated menu with already pre-configured accessibility settings, follow the instructions below.
<ol>
<li>First, download the file menu-a11y.json on your computer, available in the folder SAMPLE of the plugin</li>
<li>Install the plugin **Export Import Menus”, available <a href="https://wordpress.org/plugins/export-import-menus" rel="ugc">here</a></li>
<li>Activate the plugin</li>
<li>Go to Appearance > Export/Import Menus</li>
<li>Click on the tab Import Menus</li>
<li>Click on Choose a file and import the menu-a11y.json file you just downloaded on your computer</li>
<li>On the Menu Name field, feel free to name your menu (ex.: A11y topbar menu)</li>
<li>Click on the Import Menus button</li>
<li>Validate in Appearance > Menus that your menu has been imported correctly</li>
</ol>
<h4>EXTRA</h4>
If you want to use FontAwesome icons, install the plugin FontAwesome, available <a href="https://wordpress.org/plugins/font-awesome" rel="ugc">here</a>
<h3>Overwritte accessibility settings (styles)</h3>
In the plugin directory, there’s a file SAMPLE/style-a11y.css that contains all the CSS variables used to style the different accessibility settings of the plugin. It is possible to overwritte those variables by adding this file to the root of your theme.
<ol>
<li>You need to download the style-a11y.css</li>
<li>You add the file to the root of your theme (or child-theme)</li>
<li>You add this code to your style.css @import “style-a11y.css”;</li>
</ol>
This plugin was created and is maintained by WP inclusion, a <a href="https://wpinclusion.com" rel="nofollow ugc">glossary of Web accessibility terminologies</a>.
<h3>Compatibility</h3>
This plugin is multilingual ready.

A11y Kit

Make your website accessibility better by adding pre-configured and custom settings in your menu.

CodeConfig

Md Jakirul Islam

wpwebdevs

<a href="https://codeconfig.dev/accessiy/" rel="nofollow ugc">Accessiy is the #1 accessibility plugin</a>, designed to enhance website accessibility for all users, including those with visual, auditory, motor, or cognitive disabilities. With a one-click accessibility setup, Accessiy ensures your site meets WCAG 2.1, ADA, and European Accessibility Act (EAA) accessibility standards. This lightweight accessibility solution, built without jQuery, delivers top-tier accessibility performance and integrates seamlessly with any WordPress theme. Accessiy’s accessibility toolkit empowers site owners to create an inclusive, accessibility-first digital experience.
<a href="https://codeconfig.dev/accessiy" rel="nofollow ugc">👁️More Features</a> | <a href="https://codeconfig.dev/accessiy" rel="nofollow ugc">👑Get Accessiy Pro</a> | <a href="https://codeconfig.dev/docs/accessiy" rel="nofollow ugc">📄Documentations</a> | <a href="https://www.youtube.com/playlist?list=PLNYVH9xXmhE1hwQrT0n0qR4QQ4x07BkFG" rel="nofollow ugc">⏯️Video Tutorials</a><a> | </a><a href="https://codeconfig.dev/support-portal/" rel="nofollow ugc">🎧Support</a>
<iframe loading="lazy" title="#1 Accessibility Widgets by Accessiy || Easy One-Click Accessibility Toolbar for Your Website" width="750" height="422" src="https://www.youtube.com/embed/0LxhulbP9A0?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<h3>Why Choose Accessiy for WordPress Accessibility?</h3>
Accessiy is the ultimate accessibility plugin for WordPress, offering a no-code accessibility solution to make your site universally accessible. Key accessibility benefits include: 
– One-Click Accessibility Setup: Activate accessibility features instantly for immediate accessibility improvements. 
– WCAG & EAA Accessibility Compliance: Supports global accessibility standards like WCAG 2.1 and EAA for inclusive accessibility. 
– Customizable Accessibility Toolbar: Tailor accessibility icon, size, position, and branding for seamless accessibility integration. 
– Lightweight Accessibility Design: Optimized for speed with no jQuery, ensuring fast accessibility performance. 
– Multilingual Accessibility Support: Offers accessibility in 35+ languages, including all EU accessibility-compliant languages. 
– GDPR-Compliant Accessibility: No user data collection; accessibility settings stored in localStorage for privacy-focused accessibility. 
– Responsive Accessibility Design: Accessibility optimized for desktop, tablet, and mobile devices. 
– Accessibility Statement Generator: Create a compliance-ready accessibility statement to showcase your accessibility commitment.
<h3>Why Is Accessibility Important?</h3>
Accessibility is essential for ethical and legal reasons. Website owners are responsible for ensuring accessibility compliance with WCAG and EAA standards, making accessibility features critical for inclusivity. Accessibility improves user experience, boosts SEO, and widens your audience, making accessibility a smart business choice. Accessiy simplifies accessibility compliance, helping you meet rising accessibility regulations.
<h3>Core Accessibility Features</h3>
Accessiy’s accessibility toolkit provides comprehensive accessibility enhancements for WordPress sites:
<h3>📝 Content Accessibility Adjustments <a href="https://youtu.be/bnkTpgVv-lU?si=_KLVLdwJQAgVxy7D" rel="nofollow ugc">[▶️Video Overview]</a></h3>
✅ Bigger Text (FREE): Boost accessibility with larger font sizes for improved readability
✅ Line Height (FREE): Enhance accessibility by adjusting line spacing for clearer text
✅ Text Alignment (FREE): Improve accessibility with left-aligned or justified text options
✅ Readable Font (FREE): Switch to dyslexia-friendly fonts for accessibility-focused readability
🔍 Text Magnifier (PRO): Hover-to-magnify text for advanced accessibility visibility
🔗 Highlight Links (FREE): Emphasize links to enhance accessibility in navigation
🖱️ Cursor Customization (FREE): Enlarge or style cursors for accessibility-friendly visibility
🔡 Letter Spacing (FREE): Manage letter spacing for enhanced readability
⌨️ Keyboard Navigation (FREE): Use keyboard to navigate your website
<h3>🧭 Orientation Accessibility Adjustments</h3>
📑 Page Structure (PRO): Highlight content structure for better accessibility in navigation flow
🗣️ Screen Reader Support (PRO): Enable text-to-speech accessibility for visually impaired users
📖 Reading Mask (PRO): Dim surrounding content to focus on specific accessibility-enhanced sections
🗺️ Site Map (PRO): Display a structured accessibility view of page elements for intuitive navigation
🖼️ Hide Images (PRO): Reduce visual clutter by removing images
⏸️ Pause Animations (FREE): Stop animations to improve accessibility for motion-sensitive users
🔇 Mute Sounds (PRO): Disable audio for distraction-free accessibility
📏 Reading Line (FREE): Add a horizontal guide for accessibility-guided reading
🔲 Outline Focus (FREE): Highlight headings and focusable elements for accessibility clarity
🏷️ Highlight Titles (FREE): Highlight your website titles with one click
<h3>🎨 Color Accessibility Adjustments</h3>
⚫ Grayscale Mode (PRO): Convert pages to black-and-white for accessibility-friendly contrast
🌗 Contrast Adjustment (PRO): Optimize accessibility with enhanced contrast for visual impairments
🔄 Invert Colors (PRO): Invert colors for improved visibility
💡 Brightness Control (FREE): Adjust brightness for tailored viewing comfort
🌈 Saturation Adjustment (PRO): Modify color intensity for optimized visuals
<h3>📊 Analytics</h3>
📌 Enable Analytics: One-click toggle to start tracking which features users interact with most
📈 Display Analytics: View usage data based on selected timeframes (All Time, Last 30 Days)
📊 Chart Type: Choose from 13 different chart types to visualize usage trends effectively
⭐ Uses Features: Displays the top 7 most used features along with a full list of all accessibility tools and their usage counts
<h3>📊 Statement Generator</h3>
📝 Generate Accessibility Statement 
Easily create a professional accessibility statement for your website to demonstrate compliance and transparency
<h3>Multilingual Accessibility Support</h3>
Accessiy ensures accessibility across 35+ languages, including: 
🇬🇧 English, 🇩🇪 Deutsch, 🇪🇸 Español, 🇫🇷 Français, 🇮🇹 Italiano, 🇵🇱 Polski, 🇸🇪 Svenska, 🇫🇮 Suomi, 🇵🇹 Português, 🇷🇴 Română, 🇸🇮 Slovenščina, 🇸🇰 Slovenčina, 🇳🇱 Nederlands, 🇩🇰 Dansk, 🇬🇷 Ελληνικά, 🇨🇿 Čeština, 🇭🇺 Magyar, 🇱🇹 Lietuvių, 🇱🇻 Latviešu, 🇪🇪 Eesti, 🇭🇷 Hrvatski, 🇮🇪 Gaeilge, 🇧🇩 বাংলা, 🇮🇳 हिन्दी, 🇧🇬 Български <a href="https://codeconfig.dev/accessiy/" rel="nofollow ugc">and more, for global accessibility reach.</a>
<h3>Unlock Advanced Accessibility with Accessiy Pro</h3>
Upgrade to <a href="https://codeconfig.dev/accessiy" rel="nofollow ugc">Accessiy Pro</a> for premium accessibility features like screen reader accessibility, reading mask accessibility tools, and advanced color accessibility adjustments to ensure full accessibility compliance.
<h3>24/7 Support</h3>
Our dedicated accessibility support team is available 24/7 for accessibility-related installation, customization, or troubleshooting. Contact us at <a href="https://codeconfig.dev/support-portal/" rel="nofollow ugc">Support Portal</a> for accessibility assistance.
<h3>Accessibility Customization Options</h3>
<ul>
<li>Enable/disable specific accessibility features for tailored accessibility.</li>
<li>Customize accessibility toolbar icon, title, and position (desktop, tablet, mobile).</li>
<li>Adjust accessibility-focused dark mode and cursor colors.</li>
<li>Save or reset accessibility preferences for user-friendly accessibility.</li>
<li>Show/hide accessibility plugin on specific pages or templates.</li>
</ul>
<h3>🔥 WHAT’S NEXT 🔥</h3>
Consider checking out our other products:
📦 <a href="https://wordpress.org/plugins/integrate-dropbox/" rel="ugc">File Manager For Dropbox</a> – File Manager for Dropbox lets you connect your cloud storage to your site so you can upload, embed, and share files without touching your server space.
📂 <a href="https://wordpress.org/plugins/integration-google-drive/" rel="ugc">Integration Google Drive</a> – Easily use any Google Drive files to WordPress with awesome gallery, slider carousel, file browser, and embed documents.
🛒 <a href="https://wordpress.org/plugins/essential-addons-for-woocommerce" rel="ugc">Essential Addons for WooCommerce</a> – Packed with 14+ must-have features to supercharge your WooCommerce store.
🌙 <a href="https://wordpress.org/plugins/dusky-dark-mode/" rel="ugc">Dusky Dark Mode</a> – A beautifully designed dark mode plugin for WordPress that enhances user experience day and night.

Accessibility by Accessiy – One Click ADA, EAA & WCAG Compliance That Truly Matters

Accessiy – One-click setup for WCAG, ADA & EAA compliance with smart, customizable accessibility tools

A11y Kit vs Accessibility by Accessiy – One Click ADA, EAA & WCAG Compliance That Truly Matters