This guide will review how to update categories that appear in the navigation and menu and utilize the new category capabilities of the Commerce Site Navigation.
The configurable elements outlined below can be completed within the Aspenware Commerce Administration area.
Detailed Setup Guide
Configure Externally Linking Categories (Optional)
Configure Focused Header Categories for Desktop (Optional)
Customize Language String for Empty Cart
Special Considerations
1. Configure Externally Linking Categories (Optional)
A category can be configured as an Externally Linking Category and is configured in Aspenware Commerce Admin. An Externally Linking Category represents a category that exists on another site (typically the resort’s marketing site) and is accessed from the Commerce Site Navigation by a URL.
To configure an Externally Linking Category:
Follow Step 1 in Configuration: Categories.
If the Externally Linking Category is a child category, continue on to Step 2 in Configuration: Categories.
Once the category is created and saved, it can then be configured as an Externally Linking Category. To configure:
Go to Catalog > Categories
Search and click Edit on the category you wish to make external linking.
Scroll to the ResortOS Product Settings section.
In Category External Url, paste the URL that the category should link to when a customer selects this category. We recommend that the external category link goes to a resort’s marketing site page where Headless Commerce is enabled for a specific product type (coming soon).
Check the Is External Url Category checkbox.
Click Save.
Once Category creation is complete, follow the instructions in Step 1 of this release guide (above) to refresh the categories in order to publish changes.
3. Configure Focused Header Categories on Desktop (Optional)
Up to four categories can now be flagged as focused header categories that will appear in a shop header when viewing the shop from a desktop. If more than four categories are configured as focused header categories, the shop will append a More… link as a fifth option, and selecting this will open the sidebar navigation, where the complete set of categories can be viewed (inclusive of focused header categories).
Either a parent category or subcategory can be configured as a focused header category and will not be distinguishable from each other when featured as a focused header category, for example, Child Lessons in the example above is a subcategory of Lessons and both are flagged as focused header categories. Focused Header Categories can be interchanged easily without interrupting the overall shop category taxonomy. Hidden categories will not appear in this list.
The order that these focused categories appear from left to right will respect the following category display order.
Parent category with lowest display order defined in Admin (detailed in Step 1 of Configuration: Categories) will be farthest left.
Any subcategories flagged as include in top menu in Category Configuration belonging to this parent category following their nested display order within the parent category.
Parent category with second lowest display order defined in Admin (detailed in Step 1 of Configuration: Categories).
Any subcategories flagged as include in top menu in Category Configuration belonging to this parent category following their nested display order within the parent category.
And so on..
To configure a Focused Header Category:
Follow Step 1 in Configuration: Categories.
Select Include in top menu.
Click Save.
Once complete, follow the instructions in Step 1 of this release guide to publish category admin changes to the Commerce Site Navigation.
IMPORTANT: Previously, Aspenware Commerce required that all categories were set to Include in top menu for the category to work, but this selection now is no longer required during configuration and is now used to enable this new feature.
Consequently, if there are existing Aspenware Commerce categories that were configured previously with the Include in top menu box checked, those will need to be unchecked if you do not want them displayed as focus categories in the Commerce Site Navigation.
4. Customize Language String for Empty Cart
There are several language strings available for customization in Commerce Site Navigation.
String Resource | Default/function | Location |
|---|---|---|
shoppingcart.mini.noitems | Default: No items in your cart Function: Appears when shopping cart is empty |  |
accountbuttontitle | Default: Your Account Function: Title of My Account button when logged in |  |
accountbuttonsubtitle | Default: None Function: Access vouchers, payment plans, and more | Goes underneath the “Your Account” shown above. |
Default: Sign In/Create Account Function: On menu for a user who is not logged in |  | |
Default: Sign Out Function: On menu for a logged-in user |  | |
Default: Shop Function: Shop Link Text |  |
To customize a language string:
Go to Configuration > Languages
Click Edit on English.
Expand String Resources Tab.
Search for the string resource in Resource Name.
Click Edit.
Enter the desired text to display.
Click Update.
Special Considerations
Categories fenced by customer roles are supported.
Some content elements cannot be configured, such as the cart notice title “Item Added,” “Subtotal,” “View Cart,” “Checkout”, and header content, including “Menu”, Login, Logout, and “More…” which appears if more than four focused header categories are enabled. These will be converted to language strings and customizable in Admin in a future release.
For customers using the Loyalty feature, The setting for loyalty.fab.attach.to, which controls the location of the loyalty Fab must be set to #HERO for it to display correctly. The fab position of #BRANDHEADER is not supported for ResortOS shops. (Refer to the Configuration: Loyalty for more details on editing this setting.)
For customers using the loyalty feature, the Loyalty Styles HTML widget’s HTML should be updated to the code snippet below. Note that the change is to --fab-position-top-mobile: 80px so that the fab is always located below the header and above the products and shop banner. (Refer to the Configuration: Loyalty for more details on editing this HTML widget.)
<style><!--
#loyalty-fab-target .v-application--wrap{ min-height: 0; display: block; max-width: inherit;} :root { --fab-link-text-color: #1976d2; --fab-position-top-mobile: 80px; --fab-position-top: 100px; --fab-position-right-mobile: 0; --fab-position-right:0; --fab-z-index: 999; --fab-main-text-color: #333; --fab-footer-bg-color: #e4e4e4; --fab-toggle-bg-color: #222;}
--></style>