Properties for the "Classic" Layout

This is only part of the full list of configurator properties.  The options below only appear when your configurator has the "Classic" layout selected.

Layout Options
Show Price 
  • True (Default behavior)
    If there are any rows in the PriceObject added by Pricing Rules, then the total price and a "details" button will appear.  Note that regardless of this setting, the total and button will not appear if the PriceObject has no rows (as there is neither price nor details to display).
  • False
    Never show the total price and "details" button, regardless of any pricing data that may be in the PriceObject.

 

Show Header / 
Header Image

In most layouts, the header is a bar that spans the top of the configurator.  In some cases, such as when the configurator is embedded in another web page, you may want this hidden.  You can specify an image to appear in the header bar.

 

Show Action Bar

In most layouts, the action bar is a bar just below the header, where any actions that have been built in the configurator can appear.  You can choose to show or hide the Action bar for this configurator.  (For more info on this Layout element, see the Layouts wiki page.)

 

Show Navigation

Controls the next/back buttons shown at the bottom of the page.  Note that the standard layouts have rules making the next and back buttons always visible, regardless of this setting, if the viewport is a smaller size used on mobile devices. (For more info on this Layout element, see the Layouts wiki page.)

 

Page Layout Options
Show Pages

In most layouts, the page contents is the focus of the user's attention: it shows the fields they must interact with.  Most configurators need to show the page contents.  However, if all your configurator page elements are shown as hotspots in the configurator's viewer's scene, you may not want to show the page at all. 

Note: setting this to "false" not only hides the page contents, but also the page tabs.  If you have a one-page configurator, and don't need the page tabs shown, leave this setting to true, and change the Page Tab Option "show tabs" (below) to false.

 

Page Position

In most layouts, the configurator consists of a page and a viewer.  This controls which side of the screen shows the active page, with the viewer being opposite. Values are: left or right.

 

Page Width / 
Page Width Units

Controls the width of the configurator page, given as either a flexible percentage of the screen width or a fixed number of pixels.  The remaining screen width will be used by the viewer.

 

Page Tab Options
Show Tabs

Controls whether the page tabs pane is shown. For example, if your configurator is a simple wizard-style configurator with only one page, you might want to hide the page tabs to reclaim some screen space. 

 

Show Tab Labels

Controls the display of the page tab labels.  If your page tabs use icons, or otherwise don't need a text description, use this setting to hide the descriptive tab text.

 

Tab Position

Controls whether the tabs bar is shown to the left, right, top, or bottom of the page.  The default is left.

 

Tab Style

Determines the style of page tabs in the running configurator. Options are:

  • Cards: features larger icons, appropriate for configurators with fewer pages or more detailed page tab icons.
  • Tree: A more compact layout that is appropriate for configurators with a lot of pages or that have several layers of tab nesting.

 

Tab Icon Size

Controls the size of the icons in the tabs pane when the tab style is set to 'cards'.


User Interface
Header Color

Controls the color of the header for this configurator when it is launched.  Default: Primary.

 

Submit Button Text

If set, will override the text in the submit button of the running configurator.  By default the button says "Add to Quote" or "Save" depending on the situation.

 

Custom Text for other Buttons

If you have nested configurators beneath this configurator, specify how you want them described on the Add, Remove, and Copy buttons.

 

Viewer Properties
Viewer Mode

The viewer is an optional space to the left or right of your configurator where extra visual information can be displayed. 

  • None(default)
    The configurator will stretch to fill the entire horizontal space of the viewport.  No extra information is provided.
  • Media
    The viewer will contain an image.
  • 3D Scene
    The viewer will contain a 3D scene.

Remember that this setting, like most configurator properties, can be adjusted at run time with Snap rules, as shown in these examples

Media

If Viewer Mode is set to Media, then you can select which media file you wish to show in the viewer.

 

3D Scene

If Viewer Mode is set to 3D Scene, then you can select which scene you wish to show in the viewer.

 

Referenced Scenes

If you plan on changing the scene shown in the viewer to another scene through Snap rules, you must select all the scenes you might switch to here.  This allows your configurator to pre-load those scenes for a faster user experience.

In Snap rules, to switch the running scene, you can use the 'Set viewer scene' block which can be found in the Snap toolbox category: Configurator > Interaction.

 

Clear memory when switching scenes If your configurator has multiple scenes associated, adjusting this setting may improve load or switching times.  
Automatically select corresponding page when nested scene is clicked

If your user clicks an element in the scene which comes from a nested configurator and scene, should the corresponding page appear, so they can see the detailed settings of that element?  For example, if you have a building configurator that consists of 4 floors, and your user clicks on the 3rd floor in the scene, should the page representing that 3rd floor appear automatically?  By default, this is true.

 

Show Move Animation Show an animation over the viewer when the scene loads which invites the user to interact with the 3D scene in the viewer. Otherwise they might think the 3D scene is just a static image.

 

Scene toolbar position

3D Scenes can have actions, which can appear in a toolbar.  Control the location of the toolbar here, or turn it off entirely.

 

Image Properties
Image Source for Quote

You can choose the image that will represent the configured product when it is added to a quote. This is also the image that will represent the configured product in a quote output when the products list is added (using the word list field). The options for image source are:

  • None: The first product image will be used to represent the product (this is equivalent to how standard products work)
  • Media: A static image. You can select an image from the media storage to represent the product. This is typically set via Snap rules, so that you can pick an appropriate image based on selections the user has made in the configurator.
  • Scene: A dynamic image. When a configurator is showing a 3D scene, a VRAY (or WebGL) rendered image can be used to represent the configured product. When this option is selected, you will also need to set the 'Scene Render Pass' property to specify which render pass in the 3D scene to use. 

Media File When image source is set to 'media', this specifies the media image to use. This is typically set via snap rules, so that you can pick an appropriate image based on selections the user has made in the configurator.

 

Scene Render Pass

When image source is set to 'scene', this specifies which scene render pass to use to build the image. You must type in the exact name of the render pass (case sensitive). Note that rendered images are not immediate, so when the product is added to the quote, it might take several seconds before the rendered image shows up next to the product.

 

Nested
Only used by a specific parent If this configurator is only to be used as a nested configurator by a specific parent, check this box and name the parent configurator.  Default: false.



If you need different settings than the ones provided by this layout, you can create your own.  In the Products > Layouts administrative menu, click "Add" to create a new layout, and start your layout with a clone of this or any other built-in layouts.  Modify it as you like, adjust its operation, and then use it for any configurator.


Was this article helpful?