Create Today Offer Block

The Today Offer Block is a block that you can embed in any page of your store to keep customers informed and engaged about your ongoing promotions.

You can choose to display all available offers (gifts, bundles, discounts), or just the ones you select, keeping customers informed and driving engagement with your ongoing promotions.

Note:

  • After setting up your Today Offer Block, you have to add it to your theme to make it appear on your storefront.

  • You can create multiple blocks, each with different offers and color settings, and display them on different pages.

Set up Offer List

1. General

First, fill in the General information for your widget:

Booster name: Edit the name of your Today Offer block for internal use only. This helps you manage it easily within the system and won’t be visible to customers.

Booster title: Edit the name of your Today Offer block that will be visible to customers.

Booster subtitle (optional): Add an optional description below the block title, used to provide additional context or details for the offer.

2. Offer Card

First, decide on the offer card layout for your Today Offer block. You can choose between:

  • Thumbnail: Displays the offer with a product thumbnail.

  • Product Preview: Allows customers to preview the products included in your offer.

Then, choose which offers to display on your block using 1 of these 2 methods:

  • Automatically select: Display all your active Gifts, Bundles, and Discounts. You can also untick any offer type if you want to exclude it from your block.

  • Manually select: Display only specific offers you select. If you pick deactivated offers, the block will only show them when they are activated.

In Customize offer display, click "Edit offer display" to edit each offer's content and choose which product to preview. Follow these steps:

  1. Select the offer you want to edit.

  2. Edit its title and description that will be shown to customers on the Today Offer block.

  3. Add a redirect link: When customers click on that button, they’ll be redirected to the page you link to (a product page, collection page,...). You can also edit the button text.

  4. The last option will appear differently depending on the card style you choose above:

If you choose “Thumbnail”, you can choose a thumbnail for your offer with 3 options below:

  • One Product Image: Select one product to show as the offer thumbnail.

  • Product Image Group: Choose up to 4 products to show as the offer thumbnail.

  • Custom Image: Select from available icons or upload your own image. We recommend using .jpg or .png files with a maximum size of 100 KB for fast loading.

If you choose “Product preview”, you can edit the “Product list label”, which will show a label above the product list.

Note: If you don’t edit the offer display, BOGOS will display the offer name (you set up when creating offers) as the title, and randomly select a product for the image preview.

3. Content

To attract customers' attention and provide more details about the promotion, you can:

  • Show offer description: Displays a brief description of the offer under the title (e.g., "Best products selected for you").

  • Show label in product list (only for "product preview"): Shows a label above the product list (e.g., "Buy at least 2 items from the bundle").

Set up Block Style

1. Layout

On desktop, you can choose either of two display layouts:

  • 2 offers per row

  • 3 offers per row

On mobile, the block will automatically show 1 offer per row.

2. Color

Here, you can easily customize the colors of all the block elements to match your store’s branding. There are 3 options:

  • Block: Change the overall color of the Today Offer block.

  • Offer card: Adjust the color of the offer card that shows the details of each offer.

  • Button: If you set a redirect link for your offers, you can customize the button color.

Feel free to play around with these settings and see the live results!

Add Block To Your Theme

After setting up your Today Offer block, follow these steps to make it show up on your store:

  1. Online Store > Customize

  2. Go to any page where you want the block to appear (Home page, Cart page, Product page, Collection page).

  3. Click “Add section” > Apps > Find “BOGOS: Today Offer Block”.

  1. Drag and drop the block wherever you want it.

  2. To choose which block to display if you want to show only one, instead of displaying all blocks by default, follow these steps:

Go back to the Today Offer block setup in the BOGOS app > Copy the block’s ID (e.g., 53).

> Navigate to your theme editor

> Click on the Today Offer block > Paste the ID into the “Booster ID” field (e.g., 53).

Last updated