View Categories

Settings – Interface and Accessibility

Customize how discounts appear across your store.


Overview #

The Interface and Accessibility tab is the largest settings section, controlling how discount information appears to both administrators and customers.

SectionSettings CountPurpose
Alerts3Admin notification styling
Last Focus2Admin interface highlighting
Product Message2Product page discount messages
Mini Cart & Checkout Messages3Cart area discount displays
Tier Discount Table5Quantity discount table styling
Accessibility1Screen reader support

Section 1: Alerts (Admin Interface) #

These settings control how validation messages appear in the admin panel when editing rules.

Alert Color Theme #

OptionVisual Style
RosePink/Red tones
BlueBlue tones
GrayNeutral gray
SageGreen tones
LavenderPurple tones
AmberYellow/Orange

Default: Rose
Live Preview: Shows sample text in selected color below dropdown.

Alert Position #

OptionBehavior
Inline (inside the form field)Message appears directly below the field
Top Notice (toast)Message appears as toast notification at top

Default: Inline

Alert Message Display Duration (ms) #

ParameterValue
Minimum2,000 ms
Maximum15,000 ms
Default5,000 ms

Tip: 5000ms (5 seconds) provides balanced read time.


Section 2: Last Focus (Admin Interface) #

These settings control how the interface highlights recently edited campaign rows.

Last Focus Highlight Color #

OptionBest For
RoseSofter attention
BlueProfessional
GrayMinimal
SageSubtle
LavenderElegant
AmberClear visibility

Default: Amber
Live Preview: Shows sample highlight color below dropdown.

Last Focus Highlight Duration (ms) #

ParameterValue
Minimum1,000 ms
Maximum10,000 ms
Default3,500 ms
Step250 ms

Where it appears: After saving a campaign group, the row highlights briefly to show which item you just edited.


Section 3: Product Message (Customer-Facing) #

These settings control discount messages displayed on product pages.

Product Message Position #

OptionLocation
Automatic (Above add to cart – recommended)Tries multiple positions in order
Above add to cartBefore “Add to Cart” button
Below add to cartAfter “Add to Cart” button
Above priceAbove the product price
Product summaryIn the product summary/meta area

Default: Automatic

How Automatic Works #

PriorityPosition TriedWooCommerce Hook
1stAbove add to cartwoocommerce_before_add_to_cart_form
2ndAbove pricewoocommerce_single_product_summary
3rdBelow add to cartwoocommerce_after_add_to_cart_form

The first working position is applied. If your theme doesn’t support a hook, the next is tried.

Force Product Message Position #

StatusEffect
❌ OffUses theme hooks (may not work with all themes)
✅ OnForces position via JavaScript (better compatibility)

When to enable:

  • Message doesn’t appear with your theme
  • Using page builder (Elementor, WPBakery, Divi, etc.)
  • Theme overrides standard WooCommerce hooks
  • Position changes during page builder reflows

Section 4: Mini Cart & Cart & Checkout Messages #

These settings control discount messages in cart areas.

Message Position Options #

OptionDefault
Right below the product block✅ On
As a block in the total/button area❌ Off

Both can be enabled simultaneously for maximum visibility.

Which Campaign Types Go Where #

Campaign TypeBelow ProductBlock Area
Tiered (quantity) discounts✅ If enabled✅ If enabled
Cart total discounts❌ Never✅ Always

Note: If “Below product” is ON, tiered messages show under items and are NOT repeated in block area.

Show Special Campaign Messages Below Product Line #

StatusEffect
✅ On (default)BOGO, Buy X Pay Y, Nth item discount shown under products
❌ OffThese messages only in block area

Example campaign types affected:

  • Buy X Pay Y (e.g., “Buy 3 Pay 2”)
  • Nth item discount (e.g., “50% off 4th item”)
  • Free gift campaigns

Cart/Checkout Strikethrough Price #

StatusEffect
❌ Off (default)Shows only final price
✅ OnShows original price discounted price

Visual example:

SettingMini Cart / Cart / Checkout
Off$80.00
On$100.00 $80.00

Section 5: Tier Discount Table (Customer-Facing) #

These settings control the quantity discount table on product pages.

Product Page Tier Discount Table (Enable/Disable) #

StatusEffect
✅ On (default)Quantity tier table shown on product pages
❌ OffNo table displayed

Tier Discount Table Position #

OptionLocation
Automatic (Above add to cart – recommended)Tries multiple positions
Above add to cartBefore “Add to Cart” button
Below add to cartAfter “Add to Cart” button
Above priceAbove product price
Product summaryIn product summary/meta area

Default: Automatic

How Automatic Works (Same as Product Message) #

PriorityPosition Tried
1stAbove add to cart
2ndAbove price
3rdBelow add to cart

Force Tier Discount Table Position #

StatusEffect
❌ OffUses theme hooks
✅ OnForces position via JavaScript

Enable for: Page builders, custom themes, position issues.

Use Custom Color in Tier Discount Table #

StatusEffect
❌ OffUses preset color theme from dropdown
✅ OnUses your custom hex color

When enabled, shows:

  • Color picker input
  • Hex input field (e.g., #3498db)
  • Reset button

Tier Discount Table Color Theme #

OptionStyle
RoseWarm, inviting
Sky (blue)Professional, trustworthy
GrayMinimal, clean
SageNatural, eco-friendly
LavenderElegant, premium
AmberEnergetic, attention-grabbing

Default: Sky (blue)
Live Preview: Shows sample table color below dropdown.

Note: This dropdown is only active when “Use Custom Color” is OFF.


Section 6: Accessibility #

Accessibility: Alert Role #

StatusEffect
✅ On (default)Adds role="alert" to inline messages
❌ OffNo accessibility role added

What it does:

  • Screen readers immediately announce alert messages
  • ARIA live region created for dynamic content
  • Complies with WCAG accessibility guidelines

Who benefits:

  • Visually impaired users
  • Screen reader users
  • Users requiring assistive technology

Complete Settings Reference #

All Dropdown Options Summary #

SettingOptions
Alert Color ThemeRose, Blue, Gray, Sage, Lavender, Amber
Alert PositionInline, Top Notice
Focus Highlight ColorRose, Blue, Gray, Sage, Lavender, Amber
Product Message PositionAutomatic, Above add to cart, Below add to cart, Above price, Product summary
Tier Table PositionAutomatic, Above add to cart, Below add to cart, Above price, Product summary
Tier Color ThemeRose, Blue, Gray, Sage, Lavender, Amber

All Numeric Fields Summary #

SettingMinMaxDefaultUnit
Alert Duration2,00015,0005,000ms
Focus Highlight Duration1,00010,0003,500ms

All Checkbox Settings Summary #

SettingDefaultScope
Force Product Message❌ OffCustomers
Cart Msg Below Product✅ OnCustomers
Cart Msg Block Area❌ OffCustomers
Special Msg Under Item✅ OnCustomers
Strikethrough Price❌ OffCustomers
Tier Table Enabled✅ OnCustomers
Tier Table Force❌ OffCustomers
Tier Custom Color❌ OffCustomers
Alert Role (a11y)✅ OnAccessibility

Common Configurations #

Minimalist Store #

SettingValue
Cart Message PositionBlock area only
Special Messages❌ Off
Strikethrough❌ Off
Tier Table❌ Off

Maximum Visibility #

SettingValue
Cart Message PositionBoth ✅ enabled
Special Messages✅ On
Strikethrough✅ On
Tier Table✅ On
Tier ColorAmber (attention-grabbing)

Page Builder Compatibility (Elementor, WPBakery, etc.) #

SettingValueReason
Product Message PositionManual (not Automatic)Predictable behavior
Product Message Force✅ OnWorks with page builders
Tier Table PositionManualPredictable behavior
Tier Table Force✅ OnWorks with page builders