Return to main navigation Page
You are here: Mobile > Mobile Layout - Configuration
Mobile Layouts for Configuration
Layouts are automatically configured to recognize if a user
is on a mobile device. Optimized layouts exist for both Configuration
and Commerce activities.
Mobile Configuration includes:
- Support for mobile-specific layouts
- Defined device-specific field displays
- Optimized page load and design
All Configuration rules work identically on the mobile and desktop layouts.
Any attribute that is on the desktop layout, but not on a mobile layout, behaves as if it is hidden on the mobile layout.
- All attributes on the desktop layout are in the Pipeline Viewer.
- If a constraint rule fires on a “hidden” attributes, an internal constraint error will occur.
Mobile functionality takes advantage of the native functionality of a tablet device. Examples: Date Picker and drop-downs.
AJAX-enabled attributes are changed, AJAX rules run and the results
display as expected. Pricing attributes update pricing information.
- Mobile layouts are created within the Flow Properties page.
- Mobile layouts are initially generated to contain the contents of the Desktop layout.
Mobile layouts to contain fewer attributes than that of the Desktop
layout. However, the Mobile layout cannot contain attributes not on the
- To regenerate the Mobile layout, delete the Mobile layout and restart the “Create Mobile Layout” process.
- Array sets can be dragged-and-dropped from the sidebar into groups.
- Array sets contain a Delete button, but no Edit button.
- Attributes within the sets contain Edit buttons, but no Delete buttons.
- Array sets are ordered according to the associated set order.
Array Control Attributes must be located on the same tab as the Array Set they control.
- The admin Mobile layout will be auto-generated from the Desktop layout the first time it is created.
a Mobile layout is created it becomes a separate layout that must be
updated independently in order for user side changes to take effect.
- When an attribute exists on Desktop, but not on Mobile, the attribute is still present, just hidden, on the mobile layout.
- Any rules which are related to that attribute will still fire when users access the Mobile layout.
- If a required field is not added to the mobile layout and it lacks a default value, the user will be unable to create a quote.
- “Mobile Device Enabled” system attribute is now available as a rule input for Recommendations, Constraint, and Hiding rules.
- Attribute will return “True” if the following conditions have been satisfied:
- User is on Mobile device.
- Admin has enabled Mobile access for user.
- Admin has defined Mobile layout.
- System attribute returns “False” if one or more of the above conditions have not been met.
Attributes can be moved, edited, and deleted on the Mobile layout.
An alternate stylesheet can be uploaded for Mobile. All mobile users use one alternate stylesheet.
Action bar at bottom of tablet contains the following buttons: Remove Layout, Layout Properties, and Preview.
Multiple column layouts on Desktop will be converted into a single column on Mobile.
Layout Properties has been moved from the Config Flow Editor page to the Desktop and Mobile Layout Page.
For information about desktop layouts, see Layout Editor Overview.
Creating a Mobile Configuration Flow
- Navigate from Admin Home Page >
Products > Catalog Definition > All Product Families > List
> Select Product Family > Configuration Flow
- Click Add to create a new flow rule.
Enter the Name, Variable Name, and Description of your rule.
- Select the Status of the rule.
- Active: The rule must fire if the condition is satisfied.
- Inactive: The rule does not fire, even if the condition evaluates to true.
- Internal: Only fires if the FullAccess user is the user and the condition evaluates to true.
If applicable, click Edit Start/End Dates to select the time period for which the rule is valid.
If no Start/End dates are selected, then it is assumed that the status is valid until the FullAccess user changes it.
- Choose your Condition Type.
- Specify the Wizard Node Type:
- Start Node:
Where the config flow will begin. You can have more than one start
node, so if you plan on having multiple, this will be what you set your
beginning nodes to.
- End Node: Final node of
the flow. This is where you'll see your action buttons like Add to
Quote, as well as any recommended line items. As with start nodes, you
can have multiple end nodes. The proper end node is set by attributes
in the condition.
- Start and End Node: Start and End Nodes are combined.
- Transition Node: Transitions user from one node to another based on attribute selections.
- Primary Start Node: When there is more than one start flow, this lets the application know to start here first.
- Primary Start and End Node: Primary Start and End nodes are combined.
The buttons shown below appear below the newly created Configuration Flow Rule:
Click Layout and select Create Mobile.
The Confirm dialog box appears.
For more information on Configuration Flows and/or creating a Desktop Configuration Flow Rules, see Configuration Flows.
Edit Configurable, Regular, Account, and User Attributes on the Mobile Configuration Layout Editor.
This editor functions like the Email Template Editor; for more information, see Email Templates Overview.
Select the Desktop tab to make changes to the Desktop Configuration Flow. This will direct you to the following page:
Click Layout Properties.
The Layout Properties dialog box appears.
- Specify the Processing Event:
- Action: The condition for the flow is evaluated when an action occurs (the user clicks a button) on the Model Configuration page.
- Value Change: The condition for the flow is evaluated when the users change a value for a configurable attribute.
- Tab Change: The condition for the flow is evaluated when the users move from one tab to another on the Model Configuration page.
- Select a Stylesheet from the drop-down. Click the pencil icon to make changes to the stylesheet.
- Select Tab Loading Behavior:
- Load all tabs on page load: Loads all data across tabs.
- Load only active tab on page load: Loads data on only the active tab in configuration.
Users might see a loading page appear when the switch tabs, as the
next set of data is being loaded. Select this option improves
performance and rendering speed on larger configuration flows.
- Select a Template. Click to preview the template.
- Click Ok; .the Layout Properties dialog box closes.
- Click Save.
- Click Add to begin setting up the user-side layout.
Desktop and Mobile Layouts are considered
separate Flows. If a change is made to one Flow, it will not
automatically be updated in the other Flow.
You must make changes in both the Desktop and the Mobile Layout
For more information on the Desktop Layout, see Configuration Layout Editor.
Drag & Drop Elements between Mobile Configuration Layout Editor Tabs
Dragging & dropping elements between Mobile Configuration Layout Editor tabs is an efficient way to create mobile layouts.
Navigate to Admin > Product Families > Configuration Flows- List
Click the Mobile Configuration Layout Editor link.
- Select the Element from the current Tab that you wish to move to another Tab.
Drag the Element and hover over the desired Tab.
The Tab opens so the element can be dropped onto the layout.
- Drop the Element onto the Layout of the desired Tab.
- If desired, click the Desktop link on the Configuration Flow Rules List or the Desktop tab at the top of the Configuration Layout Editor page to edit the Desktop version of the Configuration Layout Editor.
Desktop and Mobile Layouts are
considered separate Flows. If a change is made to one Flow, it will not
automatically be reflected in the other. User must make changes in both the Desktop and Mobile Layout.
For more information on the Desktop Layout, please see Configuration Layout Editor.
Although the mobile layout is visible in
iFrame, optimal user experience is achieved through the full window. The
“Occupy entire window when the site is inside a frame” parameter
controls the iFrame setting for both Desktop and Mobile layouts. This
parameter is located in General Site Options. To control this parameter, the user must select “True” to occupy the entire window when the site is inside a frame.
Pages with a large number of attributes or array rows could see performance issues. It is highly recommended that users break up large sets of data to mitigate potential performance issues.
Migrations will fail if the destination site and source site Mobile Enabled settings are not identical.
Configuration calculators are not supported on Mobile.