Add WP accessibillity widget in Navigation Menu.

Hi Rosita,

I'm not familiar with this plugin, does it offer you a shortcode? If so you can add the shortcode in a hook element, choose generate_menu_bar_items as hook, choose entire site as location.

If the plugin doesn't offer a shortcode, then you can use David's solution here:
https://generatepress.com/forums/topic/how-to-add-widget-area-with-elements/#post-1504953

Let me know :)

Hi Ying,

Thank you,

That wasn't so hard. I only needed the shortcode. I was thinking, I needed PHP. Nou let's see if I can get both buttons next to each other, probrably with custom css :)

You've managed to add the button to the navigation menu? Good job!

In order to provide some CSS solution, could you link me to your staging site?

You could use the private info field.

Let me know :)

Hmm i can't seem to find the correct CSS. I am able to style the buttons. I'll send you the info.

Try this CSS:

.ltr.left.a11y-toolbar-widget ul {
    display: flex;
}
.ltr.left.a11y-toolbar-widget ul li:nth-child(2) {
    margin-left: 20px;
}

Let me know :)

Hi! Thanks! It's resolved! It looks very nice!

Now I need to make sure my screen-reader tells wat buttons they are. So the button text, which I have set to display: none; needs to not visible, bit it needs to be an aria-label so that screenreaders, can read it. Do you know how to do that?

I am an beginner Front-end developer and I was close myself, but I couldn't find the right selector. Is there a trick to find the right selector? One more question about GenerateBlocks: I made columns for the blog with the grid block and container. How to get equal height for the featured images(now have used pictures with the same height) and the column itself? I am always struggling with this.

Hi there,

You would need access to the HTML of the buttons being output by the plugin in order to add aria-label attributes. Might be worth checking with their devs.

As for finding the right selector, using the Developer Tools feature of your browser is the way to go. Most have a + icon you can click when you have an element highlighted that will write a selector for you.

As for the blog, this might be worth a new topic with a link to the blog - should be an easy fix :)

Thanks!

Hi Tom, Thank you for the info. I am going to contact the developer for this. And I'll open a new topic.

No problem!