user roles – unfiltered_html issue with custom guttenberg block on multisite network
i have a custom guttenberg block that creates a grid of icon buttons using the package react-fa-icon-picker, it works fine if the user is a super-admin, but for editors and admins it doesn’t work beacuse of the unfiltered_html capability that thay lack.
In my edit function i have this component to let the user choose an icon with the IconPicker component
<div {...blockProps}>
<div className="button-wrapper__editor">
<IconPicker
value={attributes.buttonIcon1}
onChange={(buttonIcon1) => setAttributes({ buttonIcon1 })}
/>
<RichText
tagName="h3"
placeholder="Título"
value={attributes.buttonTitle1}
onChange={(buttonTitle1) => setAttributes({ buttonTitle1 })}
/>
</div>
And on the save function i output the chosen icon with the IconPickerItem component
export default function save(props) {
const blockProps = useBlockProps.save();
return (
<div {...blockProps}>
<a className="icon-box" href={props.attributes.buttonLink1}>
<IconPickerItem icon={props.attributes.buttonIcon1} />
<RichText.Content tagName="h3" value={props.attributes.buttonTitle1} />
</a>
</div>
I want to avoid just granting this capability to these roles, because it seems to leave my site vulnerable as discussed in this thread
Is there another way to deal with this problem?
Leave an answer