A companion plugin to test Reactification of WooCommerce Settings. This plugin includes all known possible integration methods for adding UI|UX elements to WooCommerce settings. The integration methods are intentionally stripped down for testing purposes.
A summary of the known issues is used to keep track of problems with existing integration techniques.
See Settings implementation in Core WooCommerce.
Below are checklists for each way an extension can add functionality to WooCommerce settings. If the checkbox is checked, that means the integration method has been implemented to a satisfactory degree.
- title
- info
- sectionend
- text
- password
- datetime
- datetime-local
- date
- month
- time
- week
- number
- url
- tel
- color
- textarea
- select
- multiselect
- radio
- checkbox
- image_width
- single_select_page
- single_select_page_with_search
- single_select_country
- multi_select_countries
- relative_date_selector
- Use of
woocommerce_admin_field_hook to output arbitrary HTML. - Extending
WC_Settings_Pagewith customoutputmethod to render arbitrary HTML.
- Plain Javascript to interact with the DOM.
- jQuery to interact with the DOM.
- Use of
document.addEventListener( 'DOMContentLoaded', () => { ... } )to bind JS to the DOM. - Use of
jQuery.ready()to bind JS to the DOM. - Echoing HTML with
<script>tags to output JS that interacts with the DOM.
- Use of SlotFill for rendering React components making use of Gutenberg context.
More research is required to determine how hooks are being used when settings are saved.
- Add a modern React screen via configuration and client side filtering.
npm install
npm run build
wp-env start