How do I install the web accessibility toolbar shortcode?

Posted on

Version 2.3.3 The widget toolbar is included as a link inside the web accessibility widget but may also be implemented using a shortcode. Before using the shortcode, visit the settings page, click on the Widget tab and enable the shortcode for use on the website. When the wp-ada-access-tools shortcode is placed on your website a button will be displayed. When the button is clicked the accessibility options toolbar will be displayed at the bottom of the screen. example: [wp-ada-access-tools] Available Attributes: icon: set to either an image url or font awesome 4 icon. (default: fa-universal-access) class: to include a custom class for designing the button. (default: wp-ada-compliance-accessibility-widget-showtools) text: displays visbile text after the icon. (default: none) alttext: included in the aria-label for the button link. (default: Show Accessibility Tool Bar)

How do I activate and use the Web Accessibility Widget?

Posted on

The plugin includes a public facing accessibility widget to enhance the accessibility of your website and demonstrate your commitment to ADA compliance. The widget includes a seal to indicate your commitment to accessibility, a link to report problems and a toolbar that provides website users with a variety of options to further enhance the accessibility of the website. A shortcode option is also available to display a simple link to the toolbar for use in your theme files. The following options can be found on the Widget tab on plugin settings page: a link to a contact form may be included which will trigger a button displayed inside the accessibility widget to report problems. a custom statement can be displayed inside the web accessibility widget popup. a custom logo may be displayed in the footer of the widget an option to display widget at the top or bottom of your pages primary and secondary colors may be defined for the widget Find out more about plugin settings. To activate the accessibility widget: From the WordPress dashboard, choose “Web Accessibility” and then “Settings” Click on the “Widget” tab Check the box next to “Display the accessibility widget on your public facing website” Enter the url for your contact from Choose a location for the widget, either the lower left, lower right or upper right corner Click “Save” To use the web accessibility widget: Go to you website home page and look for the “universal” icon in either the lower left, lower Read More »

Re-positioning the Web Accessibility Widget

Posted on

Version 2.3.3 Under the Widget tab of the web accessibility settings you may choose either a top or bottom placement for the widget which will place it in the upper right or lower right corner respectively. If the web accessibility widget overlays a portion of your website in the desired location you may need to move it slightly up or down using CSS. From your dashboard menu choose “Appearance > Customize”. Click on the “Additional CSS” tab. Copy and paste the provided style definition for the desired location (top or bottom) In crease the top or bottom values in increments of 5, until the desired position is achieved. Click “Publish” to save the changes. Top Position .wp-ada-compliance-accessibility-widget-hide{ top: 12px; } .wp-ada-compliance-accessibility-widget-content{ top: 65px; } .wp-ada-compliance-accessibility-widget { top: 25px; } Bottom Position  .wp-ada-compliance-accessibility-widget { bottom: 50px; } .wp-ada-compliance-accessibility-widget-content{ bottom: 25px;}   @media only screen and (max-width: 470px){  .wp-ada-compliance-accessibility-widget { bottom: 95px;  } .wp-ada-compliance-accessibility-widget-content{ bottom: 0px; }

How do I mark a table or image as presentation only.

Posted on

Tables and images used for presentation only should include a “role” attribute set to ”presentation”.  Alternatively images may include an “alt” attribute that is empty. The WP ADA Compliance plugin adds a “Format” selector to the WordPress Classic Editor or classic block allowing you to mark the table or image as either a “Presentation Table” or “Presentation Image”.  The plugin will add the role=”presentation” attribute to the table or image as the content is displayed. If the “Format” selector is not visible on your editor screen you may need to install the TinyMCE Advanced plugin to enable this option. If that does not correct the problem your WordPress Theme or another plugin may be incorrectly configured to add the Format dropdown. Ensure that it is configured to merge the two arrays as described in this complete guide.

How can I add alternate text to links enclosing font-awesome icons?

Posted on

Defining Custom Aria-Label Values for font-awesome Icons Non image icons such as font awesome are frequently used inside links without link text. Either a title or aria-label attribute must be used to provide alternate text. The WP ADA Compliance plugin will add aria-label attributes to these links when possible. Conversion will take place based on settings defined under Web Accessibility > Settings.  To define font-awesome conversions enter a list of icons to convert. Place each icon on a new line. Begin with the icon class “fa-open” followed by an equal sign “=” and then the alternate text “Screen Reader Text”. An example is provided below. Note: links with the class no-title-convert will not be converted.  For example:  fa-close=Close When encountered  <a href=”#” ><i class=”fa fa-close”></i></a>  becomes  <a href=”#” aria-label=”Close”><i class=”fa fa-close”></i></a>

How can I display only errors in pages that have been recently modified?

Posted on

Version 2.3.3 To view only errors in content that has changed after a certain date, choose a modified date and click “Filter”. Content that does not have a modified date or for which a modified date can not be determined will also be displayed. In order to locate only the desired content type use the “Post Type” filter to further narrow the results or check the box next to “hide theme errors” to display all post or page content.

Why are issues in tables created with Ninja Tables not identified?

Posted on

The Ninja Tables plugin appears to use client side programming to prepare and display its tables. Client side activities take place in the browser after the page has loaded. The WP ADA Compliance Plugin scans and filters content on the server side before a page loads therefore issues in Ninja Tables can not be identified or filtered.

Will the WP ADA Compliance Plugin automatically correct all the issues on my website?

Posted on

The WP ADA Compliance Plugin has many time saving features built in. The content filter system finds and corrects many common issues on your website, saving you time and money correcting these issues manually. Notifies users when a link opens a new window, PDF documents or other non HTML content Converts absolute font sizes in content to relative sizes (% or ems) Removes empty link and heading tags in content Removes links from images that are linked to themselves Removes redundant alt text and title attributes Adds outline styles to all focusable elements restoring visible keyboard focus Adds role and tabindex attributes to elements with event handlers that are emulating links Adds aria-label attributes with post title to read more links in post archives Adds title attributes to iframe elements Removes phrases such as “image of” or “photo of” from image alt text Converts justified text to left or right aligned and removes option to justify text Adds missing language attributes to html tags Adds skip nav links to pages where they are missing Remove auto play parameters from embedded audio or video Converts title attributes to aria-label on links and corrects accessibility issues with font awesome icons inside links Converts unlinked email addresses to mailto: links Adds “onkeypress” keyboard event handler to elements that include only mouse event handler such as onclick View our version comparison tool to see a complete list of time saving features. Viewing Automatically Corrected Issues Once you have installed the plugin and completed a full scan Read More »

What features are included on the page/post list?

Posted on

The plugin adds three options to the “All Pages” and “All Posts” screens as follows: Check for issues – Completes a scan of the page for Web Accessibility issues Evaluate with Wave – Evaluates the page with the WAVE Web Accessibility Evaluation Tool Validate HTML – Validates the HTML using the WC3 validation services  

What features are added to the media library?

Posted on

The plugin adds an accessibility issues filter to the media library which allows you to quickly identify images that are missing or invalid alternate text.  The fact that images are missing alternate text while in the Media Library may not be a problem but many websites are designed to dynamically place images on parts of your website and when not entered in the Media Library can result in issues on your website. When using the deep scan feature described in the Plugin Settings section below these issues will be identified but this feature is provided as another means to improve the overall accessibility of your website and can be used as required.

hide