Button ADA compatible

  • Resolved dianahellonextstep

    (@dianahellonextstep)


    3 years, 4 months ago

    Hi,

    We are implementing the Print-O-Matic plugin to our new website. We recently got an ADA audit done by a company, and in regards of this print button, they stated the following:
    “the print button that is implemented as a clickable <div> which needs to be adjusted to a semantic button (<button>). Please also add an aria-label=”Print Page””

    I’ve checked the Setting of the plugin (we’re using the big icon as the button) but I can’t find a place to edit the html.
    Is there any way for me to do this? Maybe through a hook? Or should I be updating the plugin’s code?

    Thanks!
    Diana.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Contributor twinpictures

    (@twinpictures)

    Excellent topic!
    We will add both the aria-label along with a filter to both the current version and the 2.0 release candidate.
    If you are setting up something new, we highly recommend you check out the RC:
    https://github.com/baden03/print-o-matic/tree/2.0-redo

    Stay tuned. We should have an update for you within the hour.

    Plugin Contributor twinpictures

    (@twinpictures)

    OK, there is even an easier solution:
    https://spacedonkey.de/2400/print-o-matic-external-buttons/

    Simply create the print button exactly how you like:

    <button id="my_print_button" class="printomatic" data-print_target="#print_me_please" aria-label="Print Page">Print Trigger</button>
    Thread Starter dianahellonextstep

    (@dianahellonextstep)

    Thanks so much @twinpictures !! I’m almost there, just looking for the attribute for the “do_not_print” – do you know which one might be? Tried data-do_not_print but no luck.
    Thanks!

    Plugin Contributor twinpictures

    (@twinpictures)

    OK, the do_not_print can be set globally in the options page, or on a per-trigger passes using the hidden print trigger as explained in the demo:

    The final thing we need to do is include a hidden print trigger using a print-me shortcode with the same id as our external trigger and the new external printstyle attribute. This shortcode must be placed someplace on the same page, and will load in all the required scripts and settings to make the print trigger work correctly.

    So on the same page the button is placed:
    <button id="my_print_button" class="printomatic" data-print_target="#print_me_please" aria-label="Print Page">Print Trigger</button>

    place the hidden print trigger with the do_not_print defined:
    [print-me id="my_print_button" do_not_print=".noprint" printstyle="external"/]

    If you still have issues, ping back and we’ll see about adding a data-element to ease the pain ??

    Thread Starter dianahellonextstep

    (@dianahellonextstep)

    not sure why the Setting Do not Print wasn’t working for me, but I found a workaround targeting a div that contained all I wanted.
    Closing the ticket, thanks so much for your help @twinpictures !

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Button ADA compatible’ is closed to new replies.