Beta Features

WARNING

Because beta features are still being iterated on, their options, default styling, or rendered HTML may change in future releases. We recommend reviewing the changelog if your templates rely on a beta block.

Beta features are experimental capabilities of the Topol Plugin that are fully functional but still evolving. They are released early so that you can try them in real templates and share feedback, while we continue to refine their behavior, configuration surface, and output.

All beta features are opt-in. They are disabled by default and must be turned on explicitly via the betaFeatures option in your TOPOL_OPTIONS configuration. Once enabled, the corresponding block appears in the Content Blocks panel in the editor sidebar marked with "Beta" tag.

Enabling beta features

Add the betaFeatures object to your plugin configuration and set each flag to true for the features you want to make available to your users:

TOPOL_OPTIONS = {
  // ...your other options
  betaFeatures: {
    carousel: true,
    rating: true,
  },
};

Currently, Plugin supports two beta features: Carousel Block and Rating Block.

Carousel Block

The Carousel Block lets you insert an image carousel (slideshow) into your email template. It is well suited to product showcases, promotional banners, and feature highlights where you want to present multiple images in a single, dynamic block.

Enable it with:

betaFeatures: {
  carousel: true,
},

Once enabled, drag the Carousel block from the Content Blocks panel into your template and configure its images and behavior from the left-hand settings panel.

The block supports:

• Image list: add, remove, and reorder slides directly from the settings panel. Each slide can have its own image source, link (href), alt text, and title.
• Image styling: configure a shared corner radius applied to every slide so the carousel matches the rest of your template.
• Navigation arrows: toggle the left/right arrows on or off, choose from a built-in library of arrow icon sets (three arrow shapes, multiple fills and outline variants in black, grey, and white), and control the arrow size.
• Thumbnails: optionally show a strip of thumbnails below the main image. When enabled, you can set the thumbnail width, corner radius, hover border color, and selected border color.
• Padding and visibility: standard padding controls plus the usual Hide on mobile / Hide on desktop toggles available to every block.

Email client support

The Carousel Block uses MJML's interactive carousel, which relies on a CSS technique (hidden radio inputs with :checked) rather than JavaScript, which is necessary because most email clients strip scripts. As a result, the interactive slideshow works in clients that support this technique (notably Apple Mail and the native Mail apps on iOS and Android). In other clients, recipients see a fallback that displays the first image as a static image. We recommend designing the first slide so that it stands on its own.

Rating Block

The Rating Block lets you collect feedback from your recipients directly from the email. Each segment of the rating is a clickable link, so when the recipient picks a score, their choice is delivered to your backend through the URL they open.

Enable it with:

betaFeatures: {
  rating: true,
},

Once enabled, drag the Rating block from the Content Blocks panel into your template. The block supports:

• Two segment modes: Text (numbered or labeled buttons) and Image (custom images per segment).
• Configurable range: choose how many segments to display and at which value the range starts.
• Optional question and captions: a headline above the segments and left/right captions. Captions can be laid out below the segments or inline beside them, with an independent layout for mobile.
• Two URL modes:
  1. Pattern uses a single URL template with a {value} placeholder that is substituted per segment, for example https://example.com/feedback?score={value}.
  2. Individual lets you set a unique link per segment.
• Styling controls: segment size, spacing, border, corner radius, background and text colors, optional hover styling, plus full typography control for the question, captions, segment labels, and image labels.
• Multilingual support: the question, captions, URL pattern, and per-segment labels and links are all translatable when your template uses multiple languages.