I was able to figure out a way to do it by using ‘tags’ on the products. I wanted to do it early in the page loading so I added it to the custom plugin functions.php i created per recommendation of the Storefront theme.
By executing it before other code has loaded, the ‘product’ variable is not yet populated with a WC_Product object yet, but does appear to contain the string from the $REQUEST input.
EDIT: modified to include ‘hack’ for loading javascript in wsform preview
function wsform_preview_scripts($form_id) {
// hash of product names to use when previewing forms in WS Form editor
$product_preview = [
2 => 'product-example'
];
if(array_key_exists($form_id, $product_preview)) {
load_product_scripts($product_preview[$form_id]);
}
}
function load_product_scripts(string $product) {
// retrieve the WC_Product object for the current product (includes tags)
$product_object = wc_get_products( array('name' => $product) )[0];
// pointer to a directory containing custom scripts and css
if(($product_scripts_path = realpath(__DIR__."/products")) && ($product_object instanceof WC_Product)) {
// get an array of the product tag slugs
$tagslugs = array_map( function($tag) { return $tag->slug; }, get_the_terms( $product_object->get_id(), 'product_tag' ) );
foreach($tagslugs as $ts) {
// load custom styles by tag (if they exist)
if(file_exists($product_scripts_path . "/" . $ts . ".css")) {
wp_enqueue_style( 'product-customization-' . $ts, plugins_url( '/products/'.$ts.'.css', __FILE__ ) );
}
// load custom scripts by tag (if they exist)
if(file_exists($product_scripts_path . "/" . $ts . ".js")) {
wp_enqueue_script( 'product-customization-' . $ts, plugins_url( '/products/'.$ts.'.js', __FILE__ ), array( 'jquery' ) );
}
}
}
}
function theme_add_custom_scripts()
{
// if this appears to be a product, load custom product scripts
if (is_product()) {
global $product;
load_product_scripts($product);
} elseif(array_key_exists('wsf_preview_form_id', $_GET)) {
wsform_preview_scripts($_GET['wsf_preview_form_id']);
}
}
add_action('wp_enqueue_scripts', 'theme_add_custom_scripts');
So I can add more generic tags like ‘tool’ and have a ‘tool.js’ or a ‘tool.css’ that will have code which runs on all tools, or I can get more specific with tags like ‘hammer’ with a specific ‘hammer.js’.