Notifications
Clear all

wpForo 1.x.x [Closed] Message box accessibility for use with keyboard tabs

7 Posts
2 Users
0 Reactions
1,085 Views
Posts: 4
Topic starter
(@dianabr)
Active Member
Joined: 6 years ago

The message box located on the right top of the screen is in the html code at the bottom of the page.
When someone uses the keyboard it will  skip the message link at first. Only after the end of the page is reached the message link gets focus and is accessible by keyboard.
Is it possible to set the focus earlier on the page?

6 Replies
Chris
Posts: 3650
(@chris)
Famed Member
Joined: 3 years ago

Hi @dianabr,

The message box located on the right top of the screen have time out, so they close automatically after the time ends.

Posts: 4
Topic starter
(@dianabr)
Active Member
Joined: 6 years ago

Well thats another accessibility problem. The message is closing to soon to read for the screenreader. So i changed that so that it will not close after the time ends.

So is there a way to get the focus of the message earlier on the page?

2 Replies
Chris
(@chris)
Joined: 3 years ago

Famed Member
Posts: 3650

@dianabr,

For now you can close it by clicking on it with the mouse, or we can give you a code which will let to close all opened message boxes with pressing Esc button on the keyboard.

Chris
(@chris)
Joined: 3 years ago

Famed Member
Posts: 3650

Use this steps to close the message box with Esc button.

1. Download and Install "Code Snippets" Plugin for WordPress

2. Open Dashboard > Snippets > Add New 

3. Write a Title

4. Add the Below Code, Check the "Only run on site front-end" Checkbox and press Save Changes and Activate

add_action( 'wp_footer', function () { ?>
<script>

	jQuery(document).ready(function($){
    $(document).on("keydown", function (e) {
        if( e.code === 'Escape' ) wpforo_notice_clear();
    });
});

</script>
<?php } );
Posts: 4
Topic starter
(@dianabr)
Active Member
Joined: 6 years ago

I think you dont understand what i want.

The html code of the message box is at the end of the code of the page.
A screenreader or someone who uses his keyboard will only reach the message at the end of the page. This in not logical in an accessibilty point of view.
The message schould be in focus in the beginning of the page.

I want to know if there is a way to get the code of the message box somewhere at the beginning of the page so that someone who is disabled will get to the message earlier than the footer links.
Because now the message in the messagebox is only accessible for them at the end of the page, after the links in the footer. And the message is more important then the links in the footer.

I hope you can help me out.

Chris
Posts: 3650
(@chris)
Famed Member
Joined: 3 years ago

@dianabr,

Posted by: @dianabr

The html code of the message box is at the end of the code of the page.
A screenreader or someone who uses his keyboard will only reach the message at the end of the page. This in not logical in an accessibilty point of view.
The message schould be in focus in the beginning of the page.

I want to know if there is a way to get the code of the message box somewhere at the beginning of the page so that someone who is disabled will get to the message earlier than the footer links.

you should not do that, the Code won't work correctly, it will conflict with other themes.