NxM Widget — Buy N, Pay M
What does it do? Display "2x1", "3x2", or "4x3" style promotions directly on the product page of your store. The customer chooses how many units to take, can select the variant for each one, and sees the total price with the savings already calculated.
Examples: 2x1 (Take 2, pay 1) · 3x2 (Take 3, pay 2) · 4x3 (Take 4, pay 3)
Before you start: Create the promotion in Tiendanube
As with the quantity widget, the discount is applied through a Bundle-type promotion in Tiendanube. The Nuby widget is the visual interface — without the promotion in TN, the customer will see the widget, but the price in the cart will not change.
Steps:
Go to your Tiendanube admin panel.
Go to Marketing → Promotions → New promotion.
Choose the type "Buy N, Pay M" or "Bundle".
Configure the same rules you will define in Nuby (e.g., 2x1, 3x2).
Assign the promotion to the corresponding product.
Save and activate the promotion.
How to create the widget in Nuby
Step 1 — Choose which products to apply it to
From the Nuby dashboard, go to Widgets → New widget → NxM (Buy N, Pay M).
You have two options:
Option | When to use it |
Specific Product | One or several specific products. You can add multiple. |
Category | You want the widget to appear on all products within a category. |
Step 2 — Configure the promos
You can add one or more options to the same widget (e.g., offering both "2x1" and "3x2" so the customer can choose).
For each promo, you configure:
Field | Description |
Promo Type | The NxM format (e.g., 2x1, 3x2, 4x3) |
Subtitle | Short description (e.g., "Take 3, pay 2") |
Custom badge | Free text to highlight that option (e.g., "Today only", "Most popular!") |
"Best Seller" badge | Mark an option as the most popular |
Shipping badge | Free shipping text or icon |
Pre-selected promo: Choose which one appears active by default.
How the customer sees the widget
The customer sees the options as selectable buttons. When choosing one (for example "3x2"), 3 variant selectors appear — one for each unit they are taking. They can choose a different size or color for each unit.
The price is calculated in real-time:
The prices of the N chosen units are summed.
They are sorted from highest to lowest.
Only the M most expensive ones are charged (the cheapest one(s) are free of charge).
The final price is shown vs. the original strikethrough price.
Step 3 — Customize the design
Option | What it allows you to do |
Accent color | Main color for buttons and active elements |
Background color | Background of the widget block |
Selected option color | Outline/background of the active promo |
Show original price | Strikethrough price (price without promo) |
Show savings | Badge with the percentage the customer saves |
Border radius | How rounded the corners are |
Step 4 — Publish the widget
Click Save and Publish. To pause the promo, you can deactivate it without deleting it.
Frequently Asked Questions
Does the discount apply automatically?
No. You need to have the promotion created in Tiendanube (see "Before you start" section). The Nuby widget is the visual presentation — the TN promo is what applies the discount at checkout.
Can the customer choose different variants for each unit?
Yes. For example, in a 3x2, they can take size S, M, and L in the same purchase. Each unit has its own variant selector.
Can I apply the widget to several products at once?
Yes. You can select multiple individual products or choose an entire category.
Which unit is "free"?
The cheapest one. If the customer chooses three variants with different prices, they pay for the two most expensive ones and the cheapest one is not charged.
Can I have a 2x1 and a 3x2 together in the same widget?
Yes. You can add multiple options within the same widget and the customer chooses which one they want to take advantage of.