Skip to main content

Additional Use Cases

Customize the personalize button​

The text, colors, size and weight of the button are set from the Spiff Connect page in the WordPress admin. See Installation.

For anything beyond those settings, the button is created in the plugin's public/js/create-design-button.js file. The button is created programmatically, so extra styles are applied in the createButton function.

const button = document.createElement("button");
button.innerText = text;
button.className = buttonClass;

The button is placed in a container with the class spiff-button-integration-product-<integration product ID>, which you can target from your theme's CSS.

Change the order number sent to Spiff Commerce​

By default the WooCommerce order ID is sent to Spiff Commerce as the order's external ID. If you use custom order numbers, return the value you want from the spiff_order_external_id filter.

add_filter('spiff_order_external_id', function ($order_id, $order) {
return $order->get_order_number();
}, 10, 2);

Add the customer portal to a page​

Add the customer portal button to any page, post or widget with its shortcode. Designs the customer picks in the portal are added to the cart.

[spiff_customer_portal_button]