Accesibility problems with dropdown menus in twentyten theme or others

This is a known issue with the Twenty Ten theme, arising from both the theme and core code. Twenty Ten has a number of accessibility issues – see Trac: http://core.trac.wordpress.org/ticket/14782 Some of these have been corrected in a child theme for Twenty Ten that you can get here: http://accessible.sprungmarker.de/2011/01/accessible-1-0/ The CSS and functions in the … Read more

Block Editor: add an aria-label to an option inside a SelectControl

I agree with Nathan’s answer, but you can copy the source and create your own SelectControl component based on that source. Here’s an example, with basically just the aria-label addition: <option key={ `${ option.label }-${ option.value }-${ index }` } value={ option.value } disabled={ option.disabled } aria-label={ option.ariaLabel || ” } > { option.label } … Read more

Stylesheet switching and caching

I use W3TC, so these are approaches that I can come up with it for it: Fragment caching to exclude that part of page, will reduce cache effectiveness overall. Identify page with switched stylesheet by query argument, disable caching of such pages. Identify page with switched stylesheet by URL endpoint, disable caching of such by … Read more

Add custom attribute to menu item link using Filter

You may target the current_page_item CSS class or you may target the current-menu-item CSS class instead. current_page_item class may not be present for all kinds of menu item. Read the answer here to know why. Whichever CSS class you choose, you may use the CODE like the following to set the attribute: add_filter( ‘nav_menu_link_attributes’, ‘wpse260933_menu_atts_filter’, … Read more

What would be the best method to code heading/title for ul or ol, Like we have caption in table?

Though this is old, I’m updating it for others who might find this question when searching later. @Matt Kelliher: Using the css :before and a data-* attribute for the list is a great idea, but can be modified slightly to be more handicap accessible as well: HTML: CSS: This will make a list with the “header” pseudo element … Read more