Versions Compared

Old Version 4

changes.mady.by.user Sarah Holst

Saved on

compared with

New Version 5

changes.mady.by.user Sarah Holst

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

The Commerce Site Navigation allows for theme customization. This guide will review how to set up that new theming. The configurable elements outlined below will need to be completed by an Aspenware Developer. Please consider the customization options outlined to ensure navigation is branded to integrate well with your resort’s visual theme and voice. Reach out to your Aspenware Service Agent (support@aspenware.com) to communicate your selections.

Settings

Overall Settings (New and existing) used by the Cloud UI Pricing Calendar

...

Language String

Description

Default

productpricingcalendar.dateprompt

Title above the date picker on the Pricing Calendar

Choose your start date

productpricingcalendar.salestatustext

Key text that will appear on the pricing calendar if price scarcity key is enabled

Detailed Setup Guide

  1. Determin Theme Customization for the Redesigned Calendar

  2. Configure Price Scarcity Display

1. Determine Theme Customization for the Redesigned Calendar

There are several options for customizing your theme. See the table below to determine which elements you’d like to customize.

Element

What’s customizable

What’s not customizable

Text elements

  • Font families are set to your fonts for titles and body copy. Additionally, the weight and line height can be adjusted so that we can optimize the design for your fonts.

  • Force caps option - Titles can be set to force caps or title case.

  • Font size will be dictated by the design system.

Color

  • Inventory and pricing scarcity colors - We will continue to offer the ability to configure the backgound color that appears on the calendar when inventory is scarce on a date. We are newly enabling the color that prices are displayed as if they are a “scarce price” to be configurable. We recommend a shade of green that is ADA compliant when set on white based on AB test results.

  • Neutral colors - We will use consistent neutral colors that are legible and look great across brands when resort primary or link colors are not used.

  • Warning colors - The font color for these messages is determined by the design system and is optimized for the user experience.

Borders and Elevation

N/A

Border radius will be configurable in 3.1 and later for all elements.

  • Border weight and roundedness (radius)- Rounded elements convert better than boxy elements. Our new design system puts this into practice with consistent border radii and weights for elements that have borders across themes.

  • Elevation - Elevation is used in several places to helps users understand the relative importance and position of different elements on the screen.

Spacing

N/A

  • Spacing between elements is designed for consistency across the platform and will look great with every theme.

2. Configure Price Scarcity Display

If using tiers via dynamic pricing, it is recommended to indicate which dates are a “limited time deal” to users by setting the price scarcity threshold (calendarsettings.pricingcountmessagethreshold) to a value that would trigger price scarcity for many dates throughout the season, but not all dates.

...