The settings page for Meacodes Accessibility Tools can be found in your WordPress dashboard under the menu “Mea Accessibility > Settings”. This page allows you to configure various aspects of the plugin to enhance the accessibility of your website.
General Tab #
The General tab includes several important settings that control the overall functionality and appearance of the Meacodes Accessibility Tools on your site.
Enable or Disable Meacodes Accessibility Tools
- Description: This toggle allows the admin to turn the accessibility tools box on or off on the frontend of the website.
- Usage: Simply switch the toggle to “On” to enable the accessibility tools or “Off” to disable them.
Plugin Name Input
- Description: The name entered here will be displayed next to the plugin icon in the header section when the accessibility plugin is opened by a user on your website.
- Usage:
- Custom Name: Enter the desired name in the input field. This name will be shown on your website.
- No Text: If you prefer not to display any text, clear the default name and save changes.
- Multilingual Sites: If your site uses Polylang, be aware that changing this name will display the chosen name without translation across all languages. To display the name translated in different languages, you need to rebuild the plugin’s language file with Polylang and enter the translation of the chosen name.
- Reset to Default: To revert to the default name and have it translated in various languages, reset the settings once.
Enable or Disable GDPR Notice
- Description: This toggle allows you to enable or disable the GDPR-ready notice icon and link in the frontend of the plugin.
- Usage: Switch the toggle to “On” to show the GDPR notice or “Off” to hide it.
Developed by Label
- Description: This checkbox allows you to show or hide the “Developed by Meacodes” label at the end of the accessibility box in the frontend of the website.
- Usage:
- Support the Project: Check the box to show the label and support Meacodes. This helps promote the project and encourage further development.
- Donation: You can also support the project by making a donation. Visit our Donation page to buy us a coffee. Thank you for your support! đź’–
Features Tab #
The Features tab in the Meacodes Accessibility Tools settings page allows you to enable or disable specific accessibility features. Each feature is controlled by a toggle switch, providing flexibility to customize the plugin according to your needs.
Font Size Feature
- Description: This feature allows users to modify the size of the text on your website, enhancing readability for those with visual impairments or preferences for larger text.
- Toggle: Switch the toggle to “On” to enable the font size adjustment or “Off” to disable it.
Line Height Feature
- Description: This feature lets users adjust the spacing between lines of text, making it easier to read and preventing the text from looking cramped.
- Toggle: Switch the toggle to “On” to enable line height adjustment or “Off” to disable it.
Letter Spacing Feature
- Description: This feature provides users with the ability to customize the spacing between letters, which can greatly improve text clarity, especially for users with dyslexia.
- Toggle: Switch the toggle to “On” to enable letter spacing adjustment or “Off” to disable it.
Dyslexia Mask Feature
- Description: The dyslexia mask applies a masking overlay that highlights one line of text at a time, reducing visual distractions and helping users with dyslexia focus on reading.
- Toggle: Switch the toggle to “On” to enable the dyslexia mask or “Off” to disable it.
Grayscale Page Feature
- Description: This feature converts the entire page to grayscale, removing color distractions and providing a simpler visual experience.
- Toggle: Switch the toggle to “On” to enable grayscale mode or “Off” to disable it.
Contrast Feature
- Description: Increasing the contrast between text and background enhances visibility, making it easier for users with low vision or color blindness to read your content.
- Toggle: Switch the toggle to “On” to enable high contrast or “Off” to disable it.
Negative Feature
- Description: This feature inverts the colors on the page, creating a high-contrast, negative color scheme that can be beneficial for users with specific visual impairments or light sensitivity.
- Toggle: Switch the toggle to “On” to enable the negative color scheme or “Off” to disable it.
Underlined Links Feature
- Description: Adding underlines to links makes them stand out from regular text, helping users quickly identify clickable elements.
- Toggle: Switch the toggle to “On” to enable underlined links or “Off” to disable it.
Highlight Links Feature
- Description: This feature emphasizes links by changing their background color or style, drawing attention to important navigational elements.
- Toggle: Switch the toggle to “On” to enable highlighted links or “Off” to disable it.
Grayscale Images Feature
- Description: Converting images to grayscale reduces visual complexity, making them easier to interpret for users with color blindness or visual processing issues.
- Toggle: Switch the toggle to “On” to enable grayscale images or “Off” to disable it.
Black and White Feature
- Description: Transforming the entire page to black and white creates a consistent and high-contrast viewing experience, improving readability and reducing visual strain.
- Toggle: Switch the toggle to “On” to enable the black and white mode or “Off” to disable it.
Style Tab #
The Style tab in the Meacodes Accessibility Tools settings page allows you to customize the appearance of the accessibility box on your website. Here are the options available in this tab:
Positionable by User
- Description: This toggle enables users to freely move the accessibility box around the page on desktop devices. This feature is disabled by default and is not available on mobile devices.
- Usage: Switch the toggle to “On” to allow users to reposition the accessibility box, or “Off” to keep it in a fixed position.
Plugin Position
- Description: This select input specifies the placement of the plugin on the page. The available positions are:
- Bottom left corner
- Bottom right corner
- Top left corner
- Top right corner
- Default: The default position is the bottom left corner.
- Usage: Select the desired position from the dropdown menu.
Background Color
- Description: This option allows you to set the background color of the accessibility box and the accessibility icon border that is clickable for opening or closing the accessibility box.
- Default: The default color is #F8F3EE.
- Usage: Use the HTML5 color selection input to choose a custom background color.
Labels Color
- Description: This option sets the color of the labels or names of each feature and the plugin name (text type).
- Default: The default color is #373737.
- Usage: Use the HTML5 color selection input to choose a custom color for the labels.
Divider Line Color
- Description: This option allows you to set the color of the plugin header and features section divider.
- Default: The default color is #C4C4C4.
- Usage: Use the HTML5 color selection input to choose a custom color for the divider line.
Plugin Logo Color
- Description: This option sets the color scheme for the plugin logo (the icon for opening and closing the accessibility box in the frontend).
- Default: The default color is #3AbDDD.
- Usage: Use the HTML5 color selection input to choose a custom color for the plugin logo.
Accent Color
- Description: This option is for the active features and their toggle buttons on hover, as well as the dyslexia reading mask’s top and bottom border.
- Default: The default color is #3AbDDD.
- Usage: Use the HTML5 color selection input to choose a custom accent color.
Buttons Color (Reset/Close)
- Description: This option sets the color of the reset and close buttons.
- Default: The default color is #3AbDDD.
- Usage: Use the HTML5 color selection input to choose a custom color for the buttons.
Buttons Hover Color (Reset/Close)
- Description: This option sets the hover color for the reset and close buttons.
- Default: The default color is #207F97.
- Usage: Use the HTML5 color selection input to choose a custom hover color for the buttons.