These fields are currently managed using "custom metaboxes", which are backend generated forms which need a page refresh to get updated values, so have limited possibilities for customizing the editor. Also, being under the content, they are cumbersome to reach, especially if there is a lot of content.
Wordpress already has an API for interacting with the post meta data, which is where the campaign configuration fields are stored. There is also an API to add additional sidebars. So we will create a new sidebar that has input controls that connect with the post meta.
- implement the sidebar and function for creating meta controls (already in https://github.com/greenpeace/planet4-plugin-gutenberg-blocks/compare/test-meta-hoc)
- investigate current duplications of color and font definitions (scss variables, custom metabox creation) and find a way to have this definition in one place and have it used for css, the sidebar and backend validation. Using a scss file for this looks like an appealing option because it's readable, though that would mean having an additional configuration file if there are non-css configurations.
- Make the theme options definition avaible to frontend JS, either through a static file or a REST API endpoint
Optionally have backend validation for the meta fields (to see if the value is in the allowed values for the theme of the post). Currently this is handled by the custom metabox (partially, it doesn't have allowed values for a theme, but one list). This can be tricky as you can specify a validator function for a post meta field, but it only gets the value of that field (e.g. link color) and is not aware of the value of the field that it depends on.EDIT: It is actually better to have the meta fields be entirely unaware of which values can be used in the editor for a certain theme.
- All custom metaboxes in master-theme (https://github.com/greenpeace/planet4-master-theme/blob/907f78f1326b66403e41c6d5cdb6e27e8db91b91/classes/class-p4-post-campaign.php#L238) need to be removed and calls to "add_post_meta" need to be added instead (https://github.com/greenpeace/planet4-master-theme/blob/e8e8aa88f1240e868726602632f97cdd4068c228/classes/class-p4-post-campaign.php#L98),
possibly wrapped in a function that handles registering the allowed values.
- Create a message where the controls currently are to point to the new sidebar.
- relates to
-
PLANET-4720 Remove color and font options from campaign customiser
- CLOSED
-
PLANET-4457 CPP - Investigate the possibility of linking the Title, CTA, Secondary & Link colours to theme.
- CLOSED
-
PLANET-4276 CPP - Define Link text color for each template
- CLOSED
-
PLANET-4506 Plastics - Social Share - Review and adjust UX
- CLOSED