I’m trying to create a Gutenberg block with ACF and some interactivity with Alpine.js
Sample:
<button @click="openFaq<?php echo $faq->ID; ?> = !openFaq<?php echo $faq->ID; ?>">
The problem is, the @click
and the contents of the double quotes are getting completely removed. If I don’t include the “@” of the “@click” – then everything gets rendered just fine.
WordPress is sanitizing my code by stripping out everything within the @click and I haven’t found a solution so far in all my digging.
Has anyone run into something like this? Anyone have any ideas on how to convince WordPress that I actually wanted my code to be rendered?
Just a guess, but you might need to add the attribute to allowed html.
https://developer.wordpress.org/reference/hooks/wp_kses_allowed_html/
That’s where I’d start looking.
I appreciate that direction, it has given me new angles to Google.
I’ve found the following:
https://github.com/AdvancedCustomFields/acf/issues/453
https://www.implenton.com/alpine-js-directives-and-wordpress-sanitization/
Nothing quite working just yet. But a new batch of Google Search tabs is still progress.
Was editing the wrong file. Edit the right file, and I got it working. doy.
https://www.implenton.com/alpine-js-directives-and-wordpress-sanitization/
I did have to switch from “@click” (shorthand) to “x-on:click”
Thanks John! Your suggestion got me Googling in the right direction.