It’s complex because the category does not get associated with the post in PHP until after a save, and the Block Editor does not refresh after save.
So the quickest solution would be JavaScript added to the edit screen which monitors change events on the taxonomy checkboxes, setting .style.display = 'none'
on the field group of the relevant category gets unchecked and .style.display = 'block'
if the relevant category gets checked.
The HTML to monitor for the checkboxes will vary based on Classic versus Block editor.
Classic looks like this:
<label class="selectit"><input value="1" type="checkbox" name="post_category[]" id="in-category-1-2" checked="checked"> Uncategorized</label>
Classic can be monitored with standard JavaScript onDOMContentLoaded
and input change
events, checking if checked and comparing to either the category ID or the textContent of the label.
Block editor looks like this:
<div data-wp-c16t="true" data-wp-component="HStack" class="components-flex components-h-stack css-1et9n8m e19lxcc00"><span class="components-checkbox-control__input-container"><input id="inspector-checkbox-control-1" class="components-checkbox-control__input" type="checkbox" value="1" checked=""><svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" role="presentation" class="components-checkbox-control__checked" aria-hidden="true" focusable="false"><path d="M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"></path></svg></span><label class="components-checkbox-control__label" for="inspector-checkbox-control-1">Uncategorized</label></div>
The checkbox is handled with React, meaning the HTML will re-render and lose all events on every interaction. One would need to either hook into events provided by the component, or monitor changes to the HTML with a MutationObserver.
Showing / Hiding meta field
In both cases, a meta field group would have an element id of pods-meta-more-fields
for a group named More Fields
.
It can be hidden or shown with
document.getElementById( 'pods-meta-more-fields' ).style.display = 'none';
and
document.getElementById( 'pods-meta-more-fields' ).style.display = 'block';
Writing it
Writing the simplest implementation depends on the names of the relevant fields, field groups, and categories to be associated.