- This topic has 5 replies, 2 voices, and was last updated 3 years, 4 months ago by
.
-
Posts
-
Hi, I’m running axe DevTools, among other tests, to check a site for accessibility issues. The current issue I’m having is that it sees the footer widget asides as too generically named. Here’s the message:
Landmarks should have a unique role or role/label/title (i.e. accessible name) combination Fix the following: The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishableTechnically, the IDs are unique, eg:
<aside id=”custom_html-7″ class=”widget_text widget inner-padding widget_custom_html”>
but I probably need to add a title, or aria label.I’m using a child theme, so I’m happy to override things manually if need be. Before I resort to that, is there a better option like a filter?
Customer Support
Hi there,
there is the
dynamic_sidebar_paramsfilter:https://developer.wordpress.org/reference/hooks/dynamic_sidebar_params/
Tricky one to use in this instance, although if you’re using Classic Editor for widgets then in the above codex comments it provides an example function to hook in custom fields. So you could re-purpose that.
If you’re using Block Editor then it would be possible to build it with GenerateBlocks Pro as that provides an option to add
attributesto the HTML.I am using Classic Editor on this site. That does look tricky though.
Maybe I’d be better off hard coding what I need, the contents don’t update often. If I do that, would it be best to copy /inc/structure/footer.php to the child theme and alter the code? It looks like I’d want to replace this chunk from about line 169:<?php if ( $widgets >= 1 ) { generate_do_footer_widget( $widget_width, 1 ); } if ( $widgets >= 2 ) { generate_do_footer_widget( $widget_width, 2 ); } if ( $widgets >= 3 ) { generate_do_footer_widget( $widget_width, 3 ); } if ( $widgets >= 4 ) { generate_do_footer_widget( $widget_width, 4 ); } if ( $widgets >= 5 ) { generate_do_footer_widget( $widget_width, 5 ); } ?>No, those are simply the
divcolumns that GP outputs. TheasideHTML is output by WP.
You need to use thedynamic_sidebar_paramsfilter to change them.Heres an example function i knocked up that will insert the widget name and ID as a title attribute for each widget on the page
function db_add_widget_title_attr($params) { // get the widget ID $id = $params[0]['id']; // get the widget name $name = isset($params[0]['widget_name']) ? $params[0]['widget_name'] : ""; // create a new aside html string with concatenated name + id title attribute $title = '<aside title="' . $name . ' ' . $id . '"'; // string replace the before widget opening tag $params[0]['before_widget'] = str_replace( '<aside' , $title , $params[0]['before_widget'] ); return $params; } add_filter('dynamic_sidebar_params', 'db_add_widget_title_attr');That worked great. One less AXE issue!
Awesome – glad to hear that!!
- You must be logged in to reply to this topic.
