Overview

SSP — Upsell Popup shows a polished modal with product cards that you assign per page. Each card can include unlimited products, optional fixed-price overrides, and skip/hide toggles. You control appearance (headline, colors, sizes) and can add Custom CSS with syntax highlighting.

How it Works

• You create one or more cards under WooCommerce → Upsell Popup.
• Each card is tied to a single WordPress page (ID) and contains product suggestions.
• Frontend renders a modal shell; products are preloaded server-side and then refreshed via AJAX.
• If a product has a fixed-price override, the add-to-cart link carries it and cart totals apply that price.

Create Upsell Cards

1. Go to WooCommerce → Upsell Popup.
2. Under Upsell Cards, click Add New Card (or edit an existing one).
3. Pick products. You can add unlimited rows. Optionally set a fixed price for any row.
4. Choose Skip if product already in cart to avoid showing items the shopper already has.
5. Toggle Hide price in popup if you want a clean, price-less card.
6. Select Show this card on page and choose the WordPress page it should appear on.
7. At the top row you can also set Show popup frequency (per load or only once).
8. Save changes.

Special “Dynamic” choices

• Lowest-priced product
• Highest-priced product
• Random product

Dynamic choices ignore items already in the cart if “Skip if in cart” is enabled.

Style & Custom CSS

• Headline text + alignment
• Text size
• Card size: xs / sm / md / lg / xl
• Grid alignment: left / center / right
• Colors: background, top bar, text, accent border, overlay, button bg/text, close button bg/text

Dynamic Suggestions

Instead of selecting a specific product, choose a special token. The plugin will pick a product at runtime:

Fixed-Price Overrides

Every suggested product can carry a fixed price. When the shopper clicks Add to cart from the popup:

• The link adds ssp_up=1 and a value parameter to the cart URL.
• Cart line item stores Upsell price meta (original → adjusted) and sets the runtime price.
• If “Hide price in popup” is off, the card shows <del> original and <ins> adjusted.

Example query: ?add-to-cart=123&ssp_up=1&ssp_dt=fixed_price&ssp_dv=19.00

Popup Behavior

• Frequency: Show once per page load or Show only once (remembered via localStorage).
• Return-to: After add-to-cart, shopper returns to the page that opened the popup.
• Close UX: Click overlay, press Esc, or click the floating × button.
• Preload + Refresh: Cards are precomputed server-side and refreshed via AJAX to reflect current cart state.

Accessibility

• Modal sets role="dialog" and aria-modal="true".
• Headline is bound to aria-labelledby.
• Product cards are keyboard navigable; Enter/Space opens the product link.
• Esc closes the popup.

FAQ