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

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. 

Define Font awesome link conversion example

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>

Posted

in

by

Tags:

The owner of this website has made a commitment to accessibility and inclusion, please report any problems that you encounter using the contact form on this website. This site uses the WP ADA Compliance Check plugin to enhance accessibility.