Title: VividWorks 3D E-Commerce Configurator Author: vividworks Published: 30 di Mai dal 2022 Last modified: 23 di Fevrâr dal 2026 --- Search plugins ![](https://ps.w.org/vividworks-3d-ecommerce-configurator/assets/banner-772x250. png?rev=2809787) ![](https://ps.w.org/vividworks-3d-ecommerce-configurator/assets/icon-256x256.png? rev=2809787) # VividWorks 3D E-Commerce Configurator By [vividworks](https://profiles.wordpress.org/vividworks/) [Download](https://downloads.wordpress.org/plugin/vividworks-3d-ecommerce-configurator.1.4.5.zip) * [Details](https://fur.wordpress.org/plugins/vividworks-3d-ecommerce-configurator/#description) * [Reviews](https://fur.wordpress.org/plugins/vividworks-3d-ecommerce-configurator/#reviews) * [Installation](https://fur.wordpress.org/plugins/vividworks-3d-ecommerce-configurator/#installation) * [Development](https://fur.wordpress.org/plugins/vividworks-3d-ecommerce-configurator/#developers) [Support](https://wordpress.org/support/plugin/vividworks-3d-ecommerce-configurator/) ## Description Integrate your VividWorks 3D E-Commerce Configurator account to any [WooCommerce](https://woocommerce.com) shop. Bring your product or products to life and let your customers experience all the details of your product in full 3D. Enable an in-store physical experience in online where you can almost touch and feel the product for real. Let your customers explore the possibilities of your product options, with safety of ensuring they can only configure the product correctly. Configure the product rules and add all the parts, materials and accessories with our web-browser based management interface. Update and edit new additions and changes and publish them with ease. The rules system allows to build complex product rules, ensuring all purchase orders can be manufactured, delivered, and installed. Map SKU codes with your e-commerce platform data to ensure showing accurate prices and bill-of-material to the end user. Enable completing the purchase through integration of the WooCommerce shopping cart. **Note:** To use this plugin you must have a valid subscription with VividWorks and an active _VividWorks 3D E-Commerce Configurator_ account. To learn more [please visit our product page](https://www.vividworks.com/solutions/3d-product-configurator). ## Screenshots [⌊The embedded configurator front-end⌉⌊The embedded configurator front-end⌉[ The embedded configurator front-end [⌊Product Settings⌉⌊Product Settings⌉[ Product Settings [⌊Material sample⌉⌊Material sample⌉[ Material sample [⌊Product measurements⌉⌊Product measurements⌉[ Product measurements ## Installation Installing our plugin is very easy, either automatically or by uploading the plugin zip file which you can download from our WordPress plugin page. There are no special technical requirements but we recommend a fairly up-to-date server and WordPress installation, for example PHP 7+ and WordPress version 5 and up. The only main requirement – for using the plugin, not installing it – is that you have to be our customer. _VividWorks 3D E-Commerce Configurator_ is a SaaS product for which this plugin implements WooCommerce integration. Installing the plugin is free but the plugin without being our customer does not really do anything. ### Installing the plugin #### Installation through the WordPress plugin directory 1. In your WordPress admin page, go to Plugins > Add New 2. Search for “VividWorks” 3. When you find our plugin (called “VividWorks 3D E-Commerce Configurator”) click the “Install Now” button. 4. Activate the plugin in the WordPress Plugin Admin (Plugins > All plugins) #### Manual installation 1. Navigate to our WordPress plugin page 2. Download the plugin `.zip` file 3. Head over to the WordPress plugin admin and hit the “Add New” button in the upper section. 4. * In the WordPress admin interface, go to Plugins, then “Add New” 5. Now choose “Upload Plugin”, always in the upper section of the page, and choose your plugin zip file. Now hit the “Install Now” in the upload widget 6. Congratulations, the VividWorks plugin is now installed! All you have to do now is _activate_ it. As you can note in the last image, WordPress offers a quick way to do this just after the installation, just hit the “Activate Plugin” button. Otherwise you can activate it later in the WordPress Plugin admin interface 7. Go to the Product settings, find the VividWorks tab, enable the configurator, and insert at least Site Configuration ID and Product ID, which can be found in the VividWorks Management site or are given to you by VividWorks ### Configuring the plugin Configuring our WooCommerce plugin is very simple. As opposed to some other similar offerings we rely completely on our own SaaS service and your WooCommerce product configuration. All our plugin has to do is show our embedded planner interface and provide integration for add-to-cart function. The configuration can be broken down into two broader steps. **General settings** and **product specific settings**. #### General settings In the WooCommerce settings interface (found under `WooCommerce > Settings`) you should now have a tab called _VividWorks Configurator_. In there you will find settings that affect all VividWorks embedded configurators on your site. Currently we have the following settings. **Note:** In the current release of our plugin we do not have an API connection to our back-end. This means that settings like the Site Configuration ID and Product ID will be provided to you by VividWorks. **DEPRECATED:** The Product Library feature has been deprecated and will be removed in a future version. Please use the Site Configuration ID setting going forward. **Default Site Configuration ID:** Site Configuration in our lingo means a single application instance with its own configuration settings. Defining the Site Configuration for the embedded configurator is obligatory. What this setting does is set the _default_ Site Configuration to be used for all WooCommerce products, unless otherwise specified in product specific settings. This is handy especially if most or all of your configurators would use the same site configuration for products. **Default Product ID:** The ID of the product used from our back-end. This setting then sets the _default_ Product ID to be used for all WooCommerce products, unless otherwise specified in product specific settings. This is handy especially if most or all of your configurators would use the same product from our back-end (think _variations_ of one product). **Default product page placement:** The default placement on product pages. Choose this to set in which setting the products will default to when enabling the configurator for them. For reference of the options, see the product specific settings later in the document. **Custom add-to-cart event:** To customize what happens after user has added a product to the cart you can add JavaScript code in this field. Please note that this code, if defined, will overrule any default WooCommerce events such as “redirect to cart”. #### Product specific settings In the WooCommerce product section (`Products` in the main menu on the left), when editing individual products you can find `VividWorks Product Configuration` tab. In here you can enable our 3D based planner for the product and tie it to a VividWorks back-end product. The main setting here is the `Enable VividWorks Planner for this product?` checkbox. Once you select this, you will see other settings. For the embedded configurator to show up you also need to provide a `Site Configuration ID` and `Product ID`, values for which we will provide to you. If you set default values for these two in the _General Settings_ they will be filled for you automatically. To control the placement of the configurator on the product detail page use the ` Planner placement on the product page`, which has three options: * **Replace Product Summary** to replace the default product summary and only show our configurator. This is the default option * **Before Product Summary** to show our configurator _above_ the default product page summary * **After Product Summary** to show our configurator _below_ the default product page summary. * **Before the Product** to show our configurator above the whole product block. * **After the Product** to show our configurator below the whole product block. Add-to-cart button can be disabled individually for each product by unticking the` Enable add-to-cart for this product?` checkbox. If your shop is using the **Composite Products** extension, you can enable product grouping in cart by selecting a composite product with the `Use composite product in cart` dropdown to be used as the grouping container. ### Embedding the planner manually The configurator can also be embedded on any page, not just product detail pages, by using a certain HTML code. On the product detail pages the positioning of the configurator can be customized by using a WordPress template tag (called `action` in WordPress lingo). ### Embedding on any page To include a planner on a normal WordPress page or post, use the following HTML markup: ```
``` The above tag would embed the planner for product with ID `5b8591c2-ed80-437b-990c- ce102120a6e6` from a site configuration with ID `32715c27-1302-4901-8527-3ca5a11b39e4`. As mentioned before in this document, these codes / IDs will be provided to you by VividWorks. Also notice that you can wrap the above HTML in any amount of other HTML you will, and style accordingly. ### Custom placement on Product Pages To place the configurator on any location of the product page, if you have a custom template, you can use the following WordPress `action`: ``` ``` The action currently assumes it is run on a WooCommerce product page and does not accept custom product or site configuration IDs. ### Grouping of Shopping Cart items In some cases it makes sense to group various components of your product under just one item in the shopping cart. This could be the case for example with modular products where the components are all priced individually. To this end we support the official WooCommerce made extension called **Composite Products**. If the Composite Products is installed and active in your shop you can enable the grouping feature in product specific configurator settings by selecting the desired composite “container” product in the `Use composite product in cart` dropdown. The dropdown menu is filled with names of all “composite” type products in your catalog. The composite product used for grouping does not have to be visible in he catalog. You can either create an arbitrary hidden composite product to be used for grouping, or use the composite product as the visible product and configure the configurator on it too. To set up the composite product you need to add “components” to it in the composite product settings. The component structure should roughly follow you products business rules, especially those that have been implemented for your product in the VividWorks configurator. For example you can define which products can be added to each component, is the component optional or not, and what are the min/max quantitie of the items. When adding the configured parts from the 3D configuration to the composite product in cart, we simply find the first non-filled component that allows adding the product( the product which matches the SKU of the part) in question. We do not consider any other rules defined in the composite product settings for now. This is because in our opinion setting up the composite products shouold be easy and straight forward, not replicating all the business rules there. A simple example is a modular sofa. Our recommendation is to add a large enough amount of components to satisfy most customers needs, so mabe 20 or more components. The components should each allow all possible part products, be optional and not have quantity limitations. Naming the components in a generic way is also advisable so for example “Part 1, Part 2, …”. This way the components will be filled with parts from the 3D configuration in order of appearance in the BOM. **Note:** To make it faster to add a lot of components, we have extended the Composite Products configuration so that you can duplicate a component. To create 20 similar components you can create and configure one and then use the “Duplicate” button found at the top of each components configuration section 11 times. You should consequently name the new components and save the product because otherwise the components configuration sections will not behave as the “natively” created components will. If the product is simpler – like for example a bicycle – it is easier to make a little bit stricter structure. The seat is most likely just one piece and only accepts seats of various types. Once the product is in the cart, we have disallowed modifying the component configuration. #### Assembly list attachment When a configuration is added to the cart using the Composite Product feature, we will also save an assembly listing of the configuration as a meta data to the order line containing the configuration (that is, the composite product container order line). This data is a PHP array and can be found in a meta data field called `_vwplume_assembly`. You can either use the meta data field in your integrations or download the assembly data in JSON or textual format via buttons added on the order lines themselves. ### Add-to-cart and pricing There will be an “Add to cart” button in the embedded configurator UI. This button relies on SKU logic configuration to be done for the products in our back-end, and those same SKUs to be found in the WooCommerce product catatalog. Note that the SKUs do not have to be defined in the same product for which the embedded configurator was enabled. Internally the add-to-cart will find a WooCommerce product or a product variation that has a SKU we happen to need, and it will add that product( or variation) into the shopping cart. For example, a user configures a product with 3 distinct parts and now wants to add it to their shopping cart. WooCommerce will receive a list of SKUs and amounts from the VividWorks back-end, something along the lines of: ``` [ { 'code': 'part-1', 'amount: 2 }, { 'code': 'part-2', 'amount: 1 }, { 'code': 'part-3', 'amount: 1, 'properties': { 'extra': 'foo' } } ] ``` Our plugin code will now go through all WooCommerce products and product variants, and find those that match the SKUs in the list. The result is that two instances of a product / variant with SKU `part-1` will be added to the cart, and one for ` part-2` and `part-3`. VividWorks does not handle pricing separately but instead relies on your existing pricing, including sales / discounts. This makes it easier for you to maintain the pricing as it only exists in one system. ## FAQ ### Where can I configure my 3D? Be in contact with us. First of all you need to be our customer. As of today we VividWorks need to configure the actual 3D products for you. We will open the configuration management interface to all of our _3D E-Commerce Configurator_ customers sometime in the near future, but for now just drop us an email. ### What do I need to put into the ID fields in the plugin settings? We will provide you with the correct IDs and other help once we have your products configured. ## Reviews There are no reviews for this plugin. ## Contributors & Developers “VividWorks 3D E-Commerce Configurator” is open source software. The following people have contributed to this plugin. Contributors * [ vividworks ](https://profiles.wordpress.org/vividworks/) [Translate “VividWorks 3D E-Commerce Configurator” into your language.](https://translate.wordpress.org/projects/wp-plugins/vividworks-3d-ecommerce-configurator) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/vividworks-3d-ecommerce-configurator/), check out the [SVN repository](https://plugins.svn.wordpress.org/vividworks-3d-ecommerce-configurator/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/vividworks-3d-ecommerce-configurator/) by [RSS](https://plugins.trac.wordpress.org/log/vividworks-3d-ecommerce-configurator/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.4.5 * Admin area fix for VividWorks plugin emptying images from non VividWorks products in orders. #### 1.4.4 * Prevent adding 0 count items to cart #### 1.4.3 * Admin area (orders) bug fix #### 1.4.2 * Minor bug fixes #### 1.4.1 * Fix for line item properties that are arrays #### 1.4.0 * Dynamicly captured product images for cart items * Small bug fixes #### 1.3.4 * Tested up to WordPress 6.8.3 * Small bug fixes #### 1.3.3 * Small bug fixes #### 1.3.2 * Tested up to WordPress 6.8.2 * Small bug fixes #### 1.3.1 * Tested up to WordPress 6.8.1 * Small bug fixes #### 1.3.0 * Tested up to WordPress 6.7.2 * Library ID is deprecated in favor of Site Configuration ID * Added support for migration, to use Site Configuration ID instead of Library ID #### 1.2.5 * Fixed a bug in cart button enabler, which did not work for non product pages #### 1.2.4 * Fixed Finnish localizations #### 1.2.3 * Fixed “enable add-to-cart” setting that was not working #### 1.2.2 * Tested to work with the newest WooCommerce (9.2.3) * Fixed a minor bug in showing read only links #### 1.2.1 * Tested up to WordPress 6.6.1 * Updated version values #### 1.2.0 * Added support for cart item meta fields based on VividWorks sales data * minor fixes #### 1.1.4 * Tested up to WordPress 6.4.3 * Fixed an issue of quantity disappearing in the classic cart page template #### 1.1.3 * Updated version values #### 1.1.2 * Price rounding settings are now transferred to our configurator instance. This makes price display consistent. #### 1.1.1 * Remove forced WooCommerce dependency #### 1.1.0 * Fixed a minor bug in Tax / VAT fields in price fetch * Added support for using Composite Products extensions to group configuration parts in cart #### 1.0.1 * Fixed add-to-cart and price query features * Added possibility to disable add-to-cart * minor bug fixes #### 1.0.0 The initial public release of the plugin. #### 0.4.1 * Minor bug fixes #### 0.4.0 * Added language / locale support #### 0.3.1 * Bug fix for add-to-cart on non-product page embeds #### 0.3.0 * Possibility to add custom JS code to run on add-to-cart * Price API to get prices for SKUs #### 0.2.1 * Performance optimization for add-to-cart #### 0.2.0 * Added hooks to view the Planner after or before the product, using actions “woocommerce_before_single_product” and “woocommerce_after_single_product”. * Added a custom action / hook to render the VividWorks Planner on any point of WooCommerce product page template by running do_action( ‘vividworks_product_configurator’) * Added default setting for product page positioning in the general main settings of the plugin * Added more spacing around the planner, above and below, when not replacing the product summary #### 0.1.0 The initial pre-release of the plugin. ## Meta * Version **1.4.5** * Last updated **8 mês ago** * Active installations **10+** * WordPress version ** 5.0 or higher ** * Tested up to **6.9.10** * PHP version ** 7.0 or higher ** * Language * [English (US)](https://wordpress.org/plugins/vividworks-3d-ecommerce-configurator/) * Tags * [3d](https://fur.wordpress.org/plugins/tags/3d/)[configuration](https://fur.wordpress.org/plugins/tags/configuration/) [cpq](https://fur.wordpress.org/plugins/tags/cpq/)[product configuration](https://fur.wordpress.org/plugins/tags/product-configuration/) [visualization](https://fur.wordpress.org/plugins/tags/visualization/) * [Advanced View](https://fur.wordpress.org/plugins/vividworks-3d-ecommerce-configurator/advanced/) ## Ratings No reviews have been submitted yet. [Your review](https://wordpress.org/support/plugin/vividworks-3d-ecommerce-configurator/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/vividworks-3d-ecommerce-configurator/reviews/) ## Contributors * [ vividworks ](https://profiles.wordpress.org/vividworks/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/vividworks-3d-ecommerce-configurator/)