Step Kit OS

A powerful WooCommerce plugin that enables 3D product customization and strengthens the connection with customers.

Author:stepkitos (profile at wordpress.org)
WordPress version required:5.0
WordPress version tested:6.9
Plugin version:1.1.23
Added to WordPress repository:31-05-2025
Last updated:29-01-2026
Rating, %:0
Rated by:0
Plugin URI:https://stepnow.pt
Total downloads:508
plugin download
Click to start download

Step Kit OS is a comprehensive WooCommerce plugin that brings 3D product customization capabilities to your online store. It allows customers to personalize products in real-time through an interactive iframe interface, creating a unique shopping experience.

Key Features:
– Seamless integration with WooCommerce
– Interactive 3D product customization interface
– Real-time product preview
– Custom product attributes support (size, name, number, signature, badge)
– Dynamic pricing based on customization options (separate pricing for name and number)
– Flexible number pricing (fixed price or per-digit pricing)
– Persistent cart functionality across sessions
– Mobile-responsive design
– Guest user support with proper session handling
– Custom meta data display in cart and orders
– Automatic cart updates and fragment refresh
– Session persistence during login/logout
– Automatic simulator button injection on product pages
– Enhanced security with proper nonce verification

The plugin provides a complete solution for stores looking to offer customizable products with a modern, interactive interface.

Product Setup

  1. Create Required Products:

    • Create four Variable Products in WooCommerce:
      • Main Kit
      • Secondary Kit
      • Third Kit
      • Goalkeeper Kit
    • For each product:
      • Add the “size” attribute with variations (e.g., S, M, L, XL)
      • Set prices and other required fields
      • Publish the products

  2. Configure Product IDs:

    • Go to WooCommerce > Step Kit OS in your WordPress admin
    • In the “Product Configuration” section:
      • Select your products from the dropdown menus for each kit type
      • The dropdowns automatically show all published WooCommerce products
    • Save your settings

  3. Create Simulator Page:

    • Create a new page with the slug “simulador”
    • Add the shortcode [custom_iframe] to the page content
    • Publish the page

  4. Add Simulator Button:

    • Edit your product pages
    • Add the shortcode [simulator_button] where you want the customization button to appear
    • Or enable automatic button injection in the plugin settings
    • Update the product pages

Shortcodes

  • [custom_iframe] – Displays the customization iframe
  • [simulator_button] – Displays the simulator button

Shortcode Parameters:

For [custom_iframe]:
– height – Iframe height (default: 100vh)
– width – Iframe width (default: 100%)
– border – Border style (default: none)
– product_id – Specific product ID (optional)

For [simulator_button]:
– label – Button text (default: “Customizar Camisola”)
– class – CSS classes for styling
– product_id – Specific product ID (optional)

Testing

  1. Visit your store’s product page
  2. Click the “Customizar Camisola” button (created by the [simulator_button] shortcode or automatic injection)
  3. You will be redirected to the /simulador page
  4. Test the customization features and complete the purchase flow
Screenshots
FAQ
ChangeLog