JavaScript API Reference

This page is written for WooCommerce developers looking to extend or customize WooCommerce Composite Products. It requires an advanced understanding of Javascript, PHP and WordPress development.

The app’s source code is built into a single file, /assets/js/add-to-cart-composite.js – the minified version of this file, /assets/js/add-to-cart-composite.min.js, is the one enqueued by the extension.

Summary

↑ Back to top

The Composite Products single-page JavaScript app handles all front-end functionality associated with configuring a Composite product and interacting with its Components. It is responsible for tasks such as loading/filtering/appending Component Options, presenting selected product details, validating selections, displaying validation messages, calculating and displaying totals, summarizing selections, updating browser history when navigating between Components, etc.

The app relies on the Backbone.js stack in order to maintain its internal state and update its views. The code is structured using a number of JS object classes that: i) act as containers of the associated Backbone models/views and ii) provide methods for accessing key properties associated with the concepts they abstract (Composite, Step, Component).

A key element of the single-page app is the Actions Dispatcher, which implements a simplified JavaScript version of the WordPress Actions API (do_action, add_action, remove_action). The Dispatcher listens to key model events and triggers actions in response to these events.

Instead of listening and responding to Backbone model change events directly, app objects (including Backbone models and views) use the JS Actions API as the primary method for exchanging information in relation to state changes and other events. The main motivation behind this approach was the need to easily prioritize object responses to these events. In addition to this, the JS Actions API also provides a centralized, generic method for registering callbacks attached to actions, which does not require any knowledge of the underlying Backbone models, or even Backbone.js itself. This makes it easier not only to write, debug and maintain the code, but also to understand and extend it.

The JS Actions API is complemented by a JS Filters API, also similar to the WordPress PHP Filters API (apply_filters, add_filter, remove_filter). It gives developers the ability to easily retrieve data and interact with the single page JS app to implement new functionality, without requiring in-depth knowledge of Backbone.js, or the study of an entirely new, unfamiliar API.

Class Reference

↑ Back to top

`WC_CP_Composite`

Description

Instantiated by the enqueued script when a Composite product form is found in the DOM. It contains all required objects and properties and is responsible for initializing all objects, propertes and state of the app. Additionally, it instantiates and provides access to Backbone models and views associated with the current availability/validation/pricing state of the Composite. Finally, it provides a number of high-level JS API methods that complement the JS Actions and Filters API.

Located in /assets/js/src/main.js

Key Properties

Property	Description
`.steps (array)`	Collection of instantiated WC_CP_Step objects.
`.scenarios (WC_CP_Scenarios_Manager)`	WC_CP_Scenarios_Manager object.
`.actions (WC_CP_Actions_Dispatcher)`	WC_CP_Actions_Dispatcher object that implements the JS Actions API.
`.filters (WC_CP_Filters_Manager)`	WC_CP_Filters_Manager object that implements the JS Filters API.
`.composite__view (Composite__View)`	Composite-level Backbone views that render the availability status, validation messages, price string, add-to-cart button and pagination/summary/navigation elements. Instantiated on the initialize_composite action.
`.api (object)`	Collection of high-level API methods to facilitate access to commonly used object methods, model attributes and other state variables.
`.$* (jQuery object)`	Cached references to commonly-used composite-related jQuery objects.

Key Methods

Method	Description
`void init()`	Called after instantiating a WC_CP_Composite object. Triggers a `wc-composite-initializing` jQuery event to provide an entry point for third-party code, and then initializes the entire app by triggering the initialize_composite and composite_initialized actions.

`WC_CP_Step`

Description

Abstracts the “step” concept of the Progressive, Stepped and Componentized layouts by providing methods for showing, validating and controlling access to a step. It also instantiates and provides access to associated Backbone models.

Located in /assets/js/src/step_factory.js

Key Properties

Property	Description
`.step_id (string)`	Unique step object identifier.
`.step_index (int)`	Zero-based index to identify the relative position of the step in the UI. Identical to the array index of the step object in the `.steps` property of the WC_CP_Composite object.
`.$* (jQuery object)`	Cached references to commonly-used step-related jQuery objects.

Key Methods

Method	Description
`string get_title()`	Returns the title of the step.
`boolean is_component()`	True if the step is a component.
`boolean is_review()`	True if the step is the summary/review step.
`boolean is_current()`	True if the step is the currently active one.
`boolean is_previous()`	True if the step is the previous one.
`boolean is_next()`	True if the step is the next one.
`void show_step()`	Called internally to bring the step into view.
`void add_validation_message( string message, string context )`	Adds a validation message to be displayed at component or composite level, depending on the value of the `context` argument (`composite \| component`).
`array get_validation_messages( string context )`	Gets the current validation messages to be displayed at component- or composite-level, depending on the value of the `context` argument (`composite \| component`).
`boolean passes_validation()`	True if the configuration of the step passes all validation checks.

`WC_CP_Component`

Description

Extends the WC_CP_Step class. It abstracts the “component” concept by providing methods for:

accessing component data associated with the current product/variation selection, such as the id, product type, quantity, product type, and title of the selected item,
showing and reloading/appending component options, and
accessing component-related configuration data.

It also instantiates and provides access to the associated Backbone models and views.

Located in /assets/js/src/step_factory.js

Key Properties

Property	Description
`.component_id (string)`	Unique identifier associated with the component object, identical to the `.step_id` property of the parent WC_CP_Step object.
`.component_index (int)`	Zero-based index to identify the relative position of the component in the UI, identical to the `.step_index` property of the parent WC_CP_Step object.
`.$* (jQuery object)`	Cached references to commonly-used component-related jQuery objects.

Key Methods

Method	Description
`string get_selected_product()`	Returns the ID of the selected product.
`string get_selected_variation()`	Returns the ID of the selected variation.
`int get_selected_quantity()`	Returns the selected product/variation quantity.
`string get_selected_product_type()`	Returns the type of the selected product.
`string get_selected_product_title( boolean formatted = false )`	Returns the (formatted) title of the selected product.
`mixed get_selected_product_meta( boolean formatted = false )`	Returns (formatted) meta of the selected product.
`boolean is_selected_product_valid()`	True if the currently selected product is compatible with the active scenarios.
`boolean is_selected_variation_valid()`	True if the currently selected variation is compatible with the active scenarios.
`boolean is_in_stock()`	Helper method to determine whether the current product/variation selection is in stock by looking for an `'.out-of-stock'` class in the component DOM.
`boolean is_optional()`	True if the component is optional, taking the active scenarios into account.
`boolean is_visible()`	True if the component is visible, taking the active scenarios into account.

`WC_CP_Scenarios_Manager`

Description

Updates the active scenarios when refreshing/appending new component options and making new product/variation selections. Triggers actions when the active scenarios are updated/changed. Calculates the active scenarios up to, or excluding a specific reference step.

Located in /assets/js/src/scenarios_manager.js

Key Methods

Method	Description
`array get_active_scenarios()`	Returns the currently active scenarios, indexed by scenario action.
`array get_active_scenarios_by_type( string scenario_action_id )`	Returns the currently active scenarios valid for a specific scenario action.
`void update_active_scenarios( WC_CP_Step triggered_by )`	Updates active scenarios after a state change of the `triggered_by` step and triggers the active_scenarios_updated and/or active_scenarios_changed action when the active scenarios are updated/changed.
`array calculate_active_scenarios( string scenario_action_id, [ WC_CP_Step ref_step ], [ boolean up_to_ref ], [ boolean excl_ref ] )`	Calculates the active scenarios for a specific scenario action up to, or excluding the reference step `ref_step`.

`WC_CP_Actions_Dispatcher`

Description

Implements a simplified JS version of the WordPress Actions API, providing a centralized, generic method for attaching prioritized callbacks to action hooks. Additionally, it listens to key model events and triggers specific actions in response to these events. The Dispatcher is the primary method for exchanging information in relation to model state changes and other events, and scheduling responses to these events.

Located in /assets/js/src/actions_dispatcher.js

Key Methods

Method	Description
`WC_CP_Actions_Dispatcher do_action( string action_name, array args )`	Executes functions attached to a specific action hook. Extra arguments are passed to the hooked callback functions as an `args` array. Returns the `WC_CP_Actions_Dispatcher` instance to allow method chaining.
`WC_CP_Actions_Dispatcher add_action( string action_name, function callback, float priority = 10, object context )`	Hooks a function to the specified action. The `priority` argument can be used to specify the execution priority of the hooked callback. A lower number translates into earlier execution. Functions with the same priority are executed in the order in which they were attached to the action. The `context` argument must be used to provide a reference to the object the method will be called on.
`WC_CP_Actions_Dispatcher remove_action( string action_name, function callback, float priority = 10, object context )`	Unhooks a function from the specified action. Returns the `WC_CP_Actions_Dispatcher` instance to allow method chaining.

`WC_CP_Filters_Manager`

Description

Implements a simplified JS version of the WordPress Filters API.

Located in /assets/js/src/filters_manager.js

Key Methods

Method	Description
`mixed apply_filters( string filter_name, array args )`	Executes functions attached to a specific action hook. Extra arguments are passed to the hooked callback functions as an `args` array. Returns the `WC_CP_Actions_Dispatcher` instance to allow method chaining.
`WC_CP_Filters_Manager add_filter( string filter_name, function callback, float priority = 10, object context )`	Hooks a function to the specified filter. The `priority` argument can be used to specify the execution priority of the hooked callback. A lower number translates into earlier execution. Functions with the same priority are executed in the order in which they were attached to the filter. The `context` argument must be used to provide a reference to the object the method will be called on. Returns the `WC_CP_Filters_Manager` instance to allow method chaining.
`WC_CP_Filters_Manager remove_filter( string filter_name, function callback, float priority = 10, object context )`	Unhooks a function from the specified filter. Returns the `WC_CP_Filters_Manager` instance to allow method chaining.

↑ Back to top

A key element of the single-page app is the Actions Dispatcher, which implements a simplified JavaScript version of the WordPress Actions API. It provides a centralized, generic method for attaching prioritized callbacks to action hooks. Additionally, it listens to key model events and triggers specific actions in response to these events. The Dispatcher is the primary method for exchanging information in relation to model state changes and other events, and scheduling responses to these events.

The following table provides a reference of all action hooks in use by the app.

For instructions on using the JS Actions API, please refer to the Examples section.

Action	Description
`show_step`	Triggered when navigating to a step. Parameters `WC_CP_Step step` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Step::show_step()`
`show_step_{step.step_id}`	Triggered when navigating to the step with ID `step_id`. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`active_step_changed`	Triggered when the active step changes. Parameters `WC_CP_Step step` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Step::set_active()`
`active_step_changed_{step.step_id}`	Triggered when the step with ID `step_id` becomes active. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`active_step_transition_start`	Triggered when the transition animation to an activated step starts. Parameters `WC_CP_Step step` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Step::set_active()`
`active_step_transition_start_{step.step_id}`	Triggered when the transition animation to the activated step with ID `step_id` starts. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`active_step_transition_end`	Triggered when the transition animation to an activated step ends. Parameters `WC_CP_Step step` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Step::set_active()`
`active_step_transition_end_{step.step_id}`	Triggered when the transition animation to the activated step with ID `step_id` ends. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_selection_changed`	Triggered when the product/variation selection of a component changes. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_selection_content_changed`	Triggered when options/content associated with a selected product change, requiring re-validation, re-calculation of totals and re-freshes of all associated views. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation.
`component_quantity_changed`	Triggered when the quantity of a selected product/variation changes. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_availability_changed`	Triggered when the availability of a selected product/variation changes. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_addons_changed`	Triggered when the Product Add-ons associated with a selected product/variation change. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_nyp_changed`	Triggered when the price of a selected Name-Your-Price product/variation changes. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_validation_message_changed`	Triggered when the validation notices associated with a Component change. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_options_state_changed`	Triggered when the in-view active/enabled Component Options of a Component change. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_options_state_changed_{step.step_id}`	Triggered when the in-view active/enabled Component Options of the Component with id === step_id change. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`active_options_changed`	Triggered when the active/enabled Component Options of a Component change. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`active_options_changed_{step.step_id}`	Triggered when the active/enabled Component Options of the Component with id `step_id` change. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`available_options_changed`	Triggered when the Component Options available in a Component change. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`available_options_changed_{step.step_id}`	Triggered when the Component Options available in the Component with ID `step_id` change. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`component_options_state_render`	Triggered before the active Component Options are rendered by the `Component_Options_View` Backbone view. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `Component_Options_View::render()`
`component_options_state_rendered`	Triggered after the active Component Options have been rendered by the `Component_Options_View` Backbone view. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `Component_Options_View::render()`
`component_options_loaded`	Triggered after a `Component_Options_Model` Backbone model has been updated with new Component Options data. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `Component_Options_Model::request_options()`
`component_scripts_initialized`	Triggered when the details associated with a new product selection are rendered by the `Component_Selection_View`, after the associated product type scripts have been initialized.Use this action hook, or the `wc-composite-component-loaded` event, to attach custom listeners/handlers or actions when the selected product details markup is rendered. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Component::init_scripts()`
`component_scripts_reset`	Triggered before unloading the details associated with a new product selection, after all attached script listeners have been unloaded. Use this action hook, or the `wc-composite-component-unloaded` event, to detach custom event listeners/handlers or actions when the selected product details markup is unloaded. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Component::reset_scripts()`
`component_totals_changed`	Triggered when the price of a Component changes. Parameters `WC_CP_Component component` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`validate_step`	Triggered during step validation, before the `Step_Validation_Model` has been updated with the validation results. Parameters `WC_CP_Step step` `boolean is_valid` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Step::validate()`
`component_summary_content_updated`	Triggered when the content associated with a specific Component in a `Composite_Summary_View` view changes. Parameters `WC_CP_Component component` `Composite_Summary_View view` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `Composite_Summary_View::render_element_content()`
`step_access_changed`	Triggered when access to a specific Step is toggled. Parameters `WC_CP_Step step` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`step_visibility_changed`	Triggered when the visibility of a specific Step is toggled. Parameters `WC_CP_Step step` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`active_scenarios_changed`	Triggered when the active scenarios change in response to a product/variation selection change in a Component. Parameters `WC_CP_Component triggered_by` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Scenarios_Manager::update_active_scenarios()`
`active_scenarios_updated`	Triggered when the active scenarios are updated (but not necessarily changed) in response to a product/variation selection change in a Component. Parameters `WC_CP_Component triggered_by` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Scenarios_Manager::update_active_scenarios()`
`hidden_components_changed`	Triggered when the list of hidden components changes. Parameters `WC_CP_Component triggered_by` Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Actions_Dispatcher::init()`
`initialize_composite`	Action that handles app initialization by prioritizing the execution of the required functions. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Composite::init()`
`composite_initialized`	Action that handles app post-initialization by prioritizing the execution of the required functions. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Composite::init()`
`composite_totals_changed`	Triggered when the composite price/totals change. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Composite::init()`
`composite_validation_status_changed`	Triggered when the validation status of the Composite changes. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Composite::init()`
`composite_validation_message_changed`	Triggered when the validation notice of the Composite changes. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Composite::init()`
`composite_availability_status_changed`	Triggered when the availability status of the Composite changes. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Composite::init()`
`composite_availability_message_changed`	Triggered when the availability html message of the Composite changes. Parameters – Hooked Refer to the `WC_CP_Actions_Dispatcher` class inline documentation. See `WC_CP_Composite::init()`

Filters Reference

↑ Back to top

For instructions on using the JS Filters API, please refer to the Examples section.

Filter	Description
`composite_validation_messages`	Filters the individual Composite validation notice messages before updating model state. Parameters `array messages` See `Composite_Data_Model::get_validation_messages()`
`composite_totals`	Filters the Composite totals before updating model state. Parameters `object totals` See `Composite_Data_Model::calculate_totals()`
`component_totals`	Filters the totals of a Component before updating the data model state. Parameters `object totals` `WC_CP_Component component` See `Composite_Data_Model::calculate_totals()`
`step_validation_messages`	Filters the validation notices associated with a step. Parameters `array messages` `string display_context` `WC_CP_Step step` See `WC_CP_Step::get_validation_messages()`
`step_is_valid`	Filters the validation status of a step before updating the `Step_Validation_Model` state. Parameters `boolean passes_validation` `WC_CP_Step step` See `WC_CP_Step::validate()`
`component_is_optional`	Filters the optional status of a Component. Parameters `boolean is_optional` `WC_CP_Component component` See `WC_CP_Component::is_optional()`
`component_selection_title`	Filters the raw product title of the current Component selection. Parameters `string title` `WC_CP_Component component` See `WC_CP_Component::get_selected_product_title()`
`component_selection_formatted_title`	Filters the formatted title of the current Component selection. Parameters `string title` `string raw_title` `string quantity` `string formatted_meta` `WC_CP_Component component` See `WC_CP_Component::get_selected_product_title()`
`component_selection_meta`	Filters the meta array associated with the current Component selection. Parameters `array meta` `WC_CP_Component component` See `WC_CP_Component::get_selected_product_meta()`
`component_selection_formatted_meta`	Filters the formatted meta associated with the current Component selection. Parameters `string formatted_meta` `array meta` `WC_CP_Component component` See `WC_CP_Component::get_selected_product_meta()`
`component_configuration`	Filters the configuration data object associated with a Component.See `WC_CP_Composite::api:: get_component_configuration()`. Parameters `object config` `WC_CP_Component component` See `WC_CP_Composite::get_component_configuration()`
`component_selection_change_animation_duration`	Filters the configuration data object associated with a Component. Parameters `integer duration` `string open_or_close` `WC_CP_Component component` See `Component_Selection_View::get_animation_duration()`
`component_summary_element_content_data`	Filters the summary element content data. Parameters `object content_data` `WC_CP_Component component` `Composite_Summary_View view` See `Composite_Summary_View::render_element_content_task()`
`component_hide_disabled_products`	Allows you to filter the output of `WC_CP_Component::hide_disabled_products()`. Parameters `boolean hide_disabled_products` `WC_CP_Component component` See `WC_CP_Component::hide_disabled_products()`
`component_hide_disabled_variations`	AAllows you to filter the output of `WC_CP_Component::hide_disabled_variations()`. Parameters `boolean hide_disabled_products` `WC_CP_Component component` See `WC_CP_Component::hide_disabled_variations()`

Examples

↑ Back to top

Bootstrapping

↑ Back to top

To interact with the app, first you need to get a reference to the displayed WC_CP_Composite object.

To do this, it is recommended to use the wc-composite-initializing jQuery event and use the WC_CP_Composite object which is passed as an event parameter:

View on Github

To get a head start when writing plugins for the Composite Products JS API, use this boilerplate plugin to ensure that your script is bootstrapped correctly.

Using the API

↑ Back to top

Once you have obtained a reference to the WC_CP_Composite object, you can write custom code to interact with it.

For example, to have a my_active_step_changed_handler function run every time the active step changes, you can hook it up to the active_step_changed action:

composite.actions.add_action( 'active_step_changed', obj.my_active_step_changed_handler, 100, obj );

Similarly, to modify the validation status of a Component, you can hook a my_custom_step_validation function to the step_is_valid filter:

composite.filters.add_filter( 'step_is_valid', obj.my_custom_step_validation, 100, obj );

Finally, to get detailed configuration data for all components, you can call the get_composite_configuration API method:

var current_configuration = composite.api.get_composite_configuration();

Working with Scenarios

↑ Back to top

The extension makes it possible to define custom Scenario Actions in order to trigger custom actions in response to configuration state changes.

For example, the Conditional Images mini-extension allows you to conditionally overlay additional images over the main Composite Product image in response to Composite Product configuration changes. To do this, it introduces a new Scenario Action called Overlay Image, which requires you to choose an image from your Media library. When all Scenario matching conditions are satified, the selected image is overlaid on top of the main Composite Product image.

To create a custom Scenario Action:

Render the settings/fields associated with your Scenario Action.
Process the submitted data.
If needed, ensure custom settings are passed to the JS app.
Implement your scenario action by listening to active Scenario changes for your specific Scenario Action.

When calculating the active Scenarios for a custom Scenario Action, all matching conditions (ticked Components) under the Scenario Configuration section must be satisfied for the Scenario to be considered as active. The extension allows you to customize the way active scenarios are matched using the woocommerce_composite_scenario_action_settings filter. For assistance, please get in touch with our Support Team.

Questions & Support

↑ Back to top

Have a question? Please fill out this pre-sales form.
Already purchased and need assistance? Get in touch with us via the Help Desk!