kimvl

Hi there, if you’re still looking for a solution:

It looks like this issue is (partly) solved in the latest update. They added a widget for Gutenberg en Elementor, to insert a link to trigger the Ally accessibility Widget (info: https://elementor.com/help/trigger-ally-from-a-webpage/)

Well, I don’t use the Gutenberg Editor or Elementor Editor for my website but I found a workaround to use this feature anyway. The Gutenberg widget inserts this code:

<div class="wp-block-ally-custom-link">
  <a class="ally-widget-trigger" href="#">Open Ally Widget</a>
</div>

In my theme’s code I just added a button with the class ‘ally-widget-trigger‘ . I can position and style it anyway I want 🙂 . Adding a custom link to your menu with url: # and class: ‘ally-widget-trigger‘ also works (info: https://themesharbor.com/adding-a-custom-class-to-a-wordpress-menu-link/ )

This button only functions properly on Gutenberg pages (and probably on Elementor pages, didn’t test this). On all the other pages, it does NOT open the widget. But there seems to be a workaround:

On Gutenberg pages, this script is loaded in the footer:

<script src="https://wordpresswebsite.com/wp-content/plugins/pojo-accessibility/modules/widget/assets/js/frontend.js?ver=3.3.0" id="ea11y-gutenberg-custom-link-js"></script>

Manually adding this script to my theme (using the wp_register_script function in functions.php ) solved the issue for me. The button is working on all pages now.

Another option is to add the JS content of that script directly to the JS code of your theme:

document.addEventListener('DOMContentLoaded', () => {
	const customLinks = document.querySelectorAll('.ally-widget-trigger');

	customLinks.forEach((link) => {
		link.addEventListener('click', () => {
			if (window?.ea11yWidget?.widget?.open) {
				return window.ea11yWidget.widget.isOpen()
					? window.ea11yWidget.widget.close()
					: window.ea11yWidget.widget.open();
			}
		});
	});
});

Both options seems to work fine (allthough I realize it’s a kind of a tricky workaround).

As long as there is no better/official option to trigger the Ally Widget from your menu or theme, this solution might help some of you out?

• This reply was modified 10 months, 1 week ago by kimvl.
• This reply was modified 10 months, 1 week ago by kimvl.

By the way, when I add the CSS-link in the header.php file manually, Lightbox is working correctly. But I don’t think that’s the best way…

Hi there, I had exactly the same problem. Creating and using categories didn’t solve the problem for me.

In my case the problem was solved by resetting the permalink structure. Permalinks were set to ‘Post name’ . I updated the permalinks to ‘Default’ and then back to ‘Post name’ and the problem was solved for my WP-site.

I hope this helps some of you out as well.