With product messages, you can show active campaigns and discounted prices on product pages, so customers learn about a campaign while they are looking at the product. Product messages appear only on product pages.
You can check how it works on RuffRuff Order Bonus Demo Products. For how it differs from widgets and badges, see Campaign display types.
Use an Online Store 2.0 theme. Product messages work only with Online Store 2.0 themes.
Enable the "RuffRuff Order Bonus" app embed in the theme editor. The app embed lets this app run in your theme, and the "Product Message" block decides where the message appears. Even if you add the block, nothing appears while the app embed is disabled. For the steps, see "Step 1 Enable the app embed" in Getting Started (Installation to Launch).
Create a place in the product template where the product message appears.
(1) Open your theme
Open Shopify admin → Online Store → Themes.
(2) Open the product template
Select "Customize", then open the product template used by the products where you want to show the message.
(3) Add the "Product Message" block
Add "Product Message" from "Add block".
(4) Save
Select "Save" in the upper-right corner.
Turn on the product message for each campaign you want to show.
(1) Open the campaign's "Display settings"
Open "Display settings" for the discount campaign or gift campaign.
(2) Turn on "Show product message"
To show the message only for some products, select "Specific product" or "Specific collection". With "All products", every product is eligible.
(3) Enter the message and select an icon
Enter the text in the "Product message" field and select an icon. To add a line break in the field, press "Shift + Enter". To show the discounted price, use a price variable (see "Price variables" in this article). Price variables are empty in gift campaigns, so enter text only.
(4) Check the display period and display conditions
Check that "Display period" and "Display conditions" cover the dates, customers, and cart contents you want. To change the order of multiple campaigns, also set "Display position".
(5) Save
Select "Save".
Within the display period, open the product page of a product where you want to show the message. If you set display conditions, meet them before you open the page (for example, for a "Customer tag" condition, log in as a customer with that tag; for a "Cart item quantity" condition, add the specified quantity to the cart). Setup is complete when the message you entered appears.
Once the "Product Message" block is added to the product template used by the product, the message appears when all of the following conditions are met. If it does not appear, check them from the top.
The "RuffRuff Order Bonus" app embed is enabled
The campaign status is "Active"
The current time is within the display period (or within the campaign's active dates if no display period is specified)
If display conditions are set, they are met
"Show product message" is on in the display settings
If specific products or collections are selected, the product being viewed is included
If it still does not appear, see Product Message Not Displaying.
In the campaign's "Display settings", you can set the following for the product message.
Show product message: When on, campaign information appears on the product page.
Products: Choose "All products", "Specific product", or "Specific collection". With "All products", every product is eligible.
Product message: The text shown on the product page. In discount campaigns, you can insert price variables.
Icon: The icon shown in the message.
Display period: Follow the campaign's active dates ("Follow active dates") or set a period used only for display ("Specify display period").
Display conditions: Use these to limit when the message appears, with conditions such as "Cart item quantity", "Cart subtotal price", "Customer login status", and "Customer tag".
Display position: The order when multiple campaigns are shown. Campaigns are sorted in ascending order by this number.
In a discount campaign with a product discount, you can insert the prices before and after the discount into the message. When a customer switches variants, the price updates too.
Original product price: Enter
{{productPrice}}. The price before the discount appears.Discounted product price: Enter
{{productDiscountedPrice}}. The price calculated with the campaign's product discount appears.
The discounted price is calculated without checking whether the customer or the cart meets the discount's eligibility conditions. The product message's display conditions and the discount's eligibility conditions are checked separately, so to confirm whether the discount applies at purchase, test with a cart and a customer that meet the eligibility conditions.
Note: In a campaign with only an order discount or a shipping discount, the discounted price is the same as the original price. In gift campaigns, both variables are empty.
In the theme editor, the "Product Message" block lets you change the following. There is no setting for font size.
Header text: The text at the top of the block.
Background and text colors: The background color of the whole block and the text color.
Border: The border color, width, and corner radius.
Spacing: The space outside the block (margin) and inside it (padding).
Modal design: The background, text, border, and button colors of the modal that opens for details.
Each campaign shows the following.
Icon: The icon selected in the display settings.
Badge: Shows the campaign state, such as "Before start", "During campaign", or "After end". For the types, see Badge.
Message: The text entered in the display settings.
Details button: Appears when both a campaign title and a description are set. Selecting it opens a modal with the title and description. If there is a discount code, a copy button also appears.
Translate the header text with Shopify's "Translate & Adapt" app. For the campaign message, switch the language in the app's display settings and enter the translation.