Description
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
– 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
The plugin provides a complete solution for stores looking to offer customizable products with a modern, interactive interface.
Product Setup
-
Create Required Products:
- Create three Variable Products in WooCommerce:
- Main Kit
- Secondary Kit
- Third Kit
- For each product:
- Add the size” attribute with variations (e.g., S, M, L, XL)
- Set prices and other required fields
- Save each product and note their IDs (visible in the URL when editing)
- Create three Variable Products in WooCommerce:
-
Configure Product IDs:
- Visit https://simuladorfeirense.vercel.app/admin
- Enter the product IDs in their respective input fields:
- Main Kit ID
- Secondary Kit ID
- Third Kit ID
- Click Save” to store the configuration
-
Create Simulator Page:
- Create a new page with the slug simulador”
- Add the shortcode
[custom_iframe]
to the page content - Publish the page
-
Add Simulator Button:
- Edit your product pages
- Add the shortcode
[simulator_button]
where you want the customization button to appear - Update the product pages
Testing
To test the complete functionality:
- Visit your store’s product page
- Click the Customizar Camisola” button (created by the
[simulator_button]
shortcode) - You will be redirected to the
/simulador
page -
Test the customization features:
- Select different kits
- Choose sizes
- Add custom text, numbers, signatures, and badges
- Preview the customizations
-
Complete the Test:
- Click Add to Cart”
- Visit the cart page to verify the customizations are displayed correctly
- Proceed to checkout to ensure customizations appear in the order
Screenshots
Admin Configuration Displays the admin interface at https://simuladorfeirense.vercel.app/admin where product IDs are configured.
Product Page with Customization Button Displays the product page with the [simulator_button] shortcode.
Simulator Page Setup Shows the simulator page [custom_iframe] shortcode for desktop.
Simulator Page Setup Shows the simulator page [custom_iframe] shortcode for mobile.
Cart with Customized Product Displays how customized products appear in the cart.
Checkout with Customizations Shows how customizations appear in the checkout process.
Installation
- Download the plugin zip file from the WordPress plugin repository or GitHub
- Upload the
step-kit-os
folder to the/wp-content/plugins/
directory - Activate the plugin through the ‘Plugins’ menu in WordPress
- Ensure WooCommerce is installed and activated
FAQ
-
What are the system requirements?
-
- WordPress 5.0 or higher
- WooCommerce 4.0 or higher
- PHP 7.4 or higher
- Modern web browser with JavaScript enabled
-
How do I add the customization interface to my products?
-
You can add the customization interface using the
[custom_iframe]
shortcode or the[simulator_button]
shortcode in your product pages. -
Can I customize the appearance of the iframe?
-
Yes, the plugin includes CSS styles that can be customized to match your theme. The iframe is fully responsive and will adapt to different screen sizes.
-
How does the cart persistence work?
-
The plugin includes advanced session handling that ensures cart contents are preserved across page loads, logins, and logouts. It uses a combination of session management and local storage to maintain cart data.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“Step Kit OS” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “Step Kit OS” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
v1.0.0
- Initial release with core functionality:
- 3D product customization interface
- WooCommerce integration
- Custom product attributes
- Cart persistence
- Session management
- Mobile responsiveness
- Custom meta data handling