Hi @24trentedeux
I haven’t found a good solution yet for the automatic process to not break embeds or longer strings of HTML due to the current nature of the Bionic Reading API limiting the number of characters per request, so for my own website that uses video embeds and even Yoast SEO’s FAQ blocks or accordions which can also get lengthy, I also use the shortcodes.
First, I toggle the “disable” button in the metabox for that post to exclude it from automatically processing the whole of the content, and then I use the default shortcode for the first element like this:
[accessible_reading id="foo"]This content will generate accessible content![/accessible_reading]
And then for all of the other content on the page where I don’t want the button to reappear, I set the hide_toggle
attribute to 1
in the shortcode like this:
[accessible_reading id="bar" hide_toggle"1"]This content will generate accessible content but without showing a toggle![/accessible_reading]
Another thing to note is that if you’re using Gutenberg/Blocks, I’ve found it better to put the opening and closing in their own blocks before and after the content you want it to process. For example, in my own article here, the first two paragraphs look like this in the Code Editor of blocks:
<!-- wp:paragraph -->
<p>[accessible_reading id="top"]</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p>AuRise Creative is proud to support the Hidden Disabilities Sunflower as a registered member of the program. Many disabilities, such as autism, chronic pain, epilepsy, low vision, hearing loss, dementia, anxiety disorders, and brain injuries, are not immediately obvious to others.</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p>If you have an invisible disability, you can choose to wear or display the Sunflower to discreetly indicate to our team that you may need some additional support when working with us.</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p>[/accessible_reading]</p>
<!-- /wp:paragraph -->
It’s not particularly pretty, HTML-wise, but I discovered that when putting the shortcodes within the blocks screws up the HTML even worse, often breaking paragraphs and losing any spacing that CSS has attached to them.
Hope that helps!