Alternative Product Notice Style Guide

When you enable the alternative product feature, the plugin lets you display a message suggesting replacement items for discontinued products. To make this suggestion more engaging and consistent with your branding, you can fully customize the style of the Alternative Product Notice.

Follow these steps to style it:

Open the Plugin Settings
Go to WooCommerce > Settings > Products> WC Discontinued Products, then scroll to the Discontinued Product Alternative Notice Styles section.

Configure Appearance Options
The styling interface mirrors the settings for discontinued notices, giving you control over layout and color:

• Padding: Adds spacing within the message box to separate the text from the edges.
• Border Settings: Choose a border style, width, and radius to frame the notice area. Use this to differentiate it from other notices.
• Text and Background Colors: Define both standard and hover states to make the message more interactive or brand-consistent.
• Border Colors: Set static and hover border colors to add visual depth or effects on hover.

Visual Consistency Tips
Use contrasting colors to make alternative product suggestions stand out. Consider using green or another positive color to indicate availability and encourage clicks. Keep text styles clean and legible.

Apply the Settings
Once you’re satisfied with your design choices, click Save Changes. The new styles will be reflected wherever alternative product suggestions are shown.

Customizing the alternative notice style helps guide customers to available products without disrupting their shopping experience, ultimately aiding in conversion and satisfaction.