Extensions

Overview

Plugin Extensions provide a flexible way to customize and extend the Stripo Plugin editor. They allow you to:

• Create custom content blocks with your own structure and behavior;
• Add custom controls to existing Stripo blocks;
• Override built-in editor components with your own (e.g., display a custom image gallery, merge tag selector, or any modal instead of the native one).

This feature is intended for advanced integrations where you need full control over the editing experience — from layout configuration to custom UI logic.

Key Use Cases

With Plugin Extensions, you can:

• Build new blocks tailored to your product (e.g., smart banners, personalized modules, data-driven content);
• Add custom controls to block settings (e.g., toggles, selects, multi-step configuration UIs);
• Replace native editor components with your own (e.g., open your own asset manager or data selector in a popup);
• Implement context-aware behavior inside the editor based on your business logic or user profile.

Learn More

You can find technical documentation, extension interfaces, and working examples in our official GitHub repository:

• Plugin Extensions Guide
• Extension Examples

Compatibility & Availability

• Supported in the new editor only
• Available starting from Plugin version 2.21.0
• Requires Business or Enterprise plan

Samples

Custom Image Gallery

If you want to replace Stripo’s default image gallery with your own image management system or media library, you can implement this via the Extensions framework as descirpbed in the sample below.

When configured, your custom gallery will open instead of the default one whenever a user clicks to insert or edit an image. You are free to define your own UI, search, filtering, or upload logic — as long as it returns a valid image URL and alt text for insertion into the email.

Please refer to the following sample to implement this feature:

• External Image Library Extension

External Smart Elements Library

Stripo allows you to enhance the Smart Elements experience by integrating your own catalog of dynamic content (e.g., products, articles, destinations) using a custom Extension. This approach doesn’t require rebuilding the logic of Smart Elements — Stripo handles layout and rendering — you only control what data gets inserted into the Smart Element block.

How it works

• When Smart Element (like product cards, articles, etc.) si selected in the editor, a custom Browse button will be displayed in the sidebar.
• When clicked, this button opens your custom external modal or dialog with a list of available items (e.g., products with images, titles, prices).
• Once the user selects an item, Stripo expects the structured data to be returned via a callback.
• This data will be automatically inserted into the Smart Element and rendered accordingly in the email template.

Benefits

• Full control over the content source and selection experience.
• Great for integrating with product feeds, CMS, internal tools, or partner APIs.

Please refer to the following sample to implement this feature:

• External Smart Elements Library Extension

This sample demonstrates how to embed a product catalog and return selected values like title, image, and price.

External Merge Tags Selector

Stripo allows you to override the default merge tag selector and connect your own system or catalog of personalization variables using a custom Extension. This is especially useful if you want to provide users with custom-defined tags (e.g., CRM fields, dynamic placeholders) managed outside of Stripo.

How it works

• Instead of the built-in merge tags selector in the editor, Stripo will display a custom button with a label defined by the plugin owner.
• When the user clicks the button, your custom modal or popup will open. You can display any catalog of personalization variables: internal tags, CRM fields, account-specific data, etc.
• Once the user selects a merge tag from your catalog, your extension must return the value of the selected tag via a callback.
• Stripo will then insert the returned value into the email template at the current cursor position.

Benefits

• Full control over which merge tags are available for selection.
• Ability to integrate dynamic or account-specific personalization variables from your own backend or third-party systems.
• Seamless insertion experience, fully replacing the default merge tag selector.

Please refer to the following sample to implement this feature:

• External Merge Tags Extension

This sample demonstrates how to show a custom merge tag selection dialog and return the tag value back to Stripo for insertion.

External Custom Font Integration

Stripo allows you to extend the default list of fonts by enabling users to add custom fonts directly inside the editor using a custom Extension. This lets your users connect brand-specific or externally hosted fonts without needing access to global plugin configuration.

How it works

• In the Font Family dropdown inside the editor, a new tab called Custom appears.
• Inside this tab, users will see a “+ Insert custom font” button.
• When clicked, Stripo will open your custom modal or external dialog where users can define a new font by providing:
  • Font Name
  • CSS declaration (e.g., font-family)
  • URL to the font file (e.g., Google Fonts or CDN)
• Once the user confirms, the custom font’s parameters are returned to Stripo via a callback.
• The font becomes available in the dropdown and can be applied to any text element inside the template.

Benefits

• Allows brands to use their own fonts without modifying plugin configuration.
• Supports integration with external font libraries or internal design systems.
• Easy to use and integrated directly into the editor UI.

Please refer to the following sample to implement this feature:

• External Custom Font Extension

This sample demonstrates how to prompt users for font details and register them dynamically in the Stripo editor.

External AI Assistant

Stripo allows you to override the default AI Assistant and integrate your own AI-powered solution to assist users in improving text content inside the email editor. This gives full flexibility over how AI suggestions are generated and managed.

How it works

• In Text blocks and other text-based inputs (e.g., titles, subtitles), Stripo shows an AI button that launches the built-in AI Assistant.
• If this extension is implemented, the AI button will instead open your custom modal window, where you can build your own content improvement experience using AI.
• This modal can integrate any third-party or custom AI service (e.g., OpenAI, Claude, internal LLM).
• After the user edits or generates improved content, your extension must return the updated text via a callback.
• The returned content will replace the original content in the editor.

Benefits

• Full control over the prompt design, user interface, and AI service.
• Ability to align AI suggestions with your brand tone, content rules, or industry-specific style.
• Easily connect internal models, SaaS tools, or custom workflows.

Please refer to the following sample to implement this feature:

• External AI Assistant Extension

This sample demonstrates how to override the AI control and return generated content to the Stripo editor.

External Video Library

Stripo allows you to override the default video input in the Video block and provide your own video selection experience using a custom Extension. This is ideal when you want to let users browse and select videos from your own video library, CMS, or hosting system.

How it works

• In the Video block settings, Stripo normally displays a field where the user can paste a link (e.g., YouTube, Vimeo, TikTok).
• When this extension is enabled, a custom button (e.g., “Pick up my video”) is shown instead.
• Clicking this button opens your external modal or dialog, where users can browse and select a video.
• Once selected, your extension must return the required video information via a callback, including:
  • Video URL (e.g., YouTube/Vimeo link)
  • Thumbnail image URL
  • Alternate text (used for alt and title attributes)
• Stripo will automatically insert the selected video and display the thumbnail preview in the template.

Benefits

• Seamless integration with your own video library or video CMS.
• Lets you enforce access control, filtering, or branding for video content.
• Full control over what metadata gets inserted into the email.

Please refer to the following sample to implement this feature:

• External Video Library Extension

This sample demonstrates how to show a custom video catalog and return selected video metadata (link, thumbnail, alt text) for rendering in the Video block.

External Display Conditions

Stripo allows you to extend or override the default Display Conditions configuration by integrating a custom modal via Extension. This gives you full control over how users define visibility rules for email elements based on custom parameters.

There are two sample implementations available:

1. Sidebar Integration — adds a custom control in the sidebar panel to configure visibility conditions.
2. Context Menu Integration — adds a custom action in the context menu (⋯) of a selected element for setting conditions.

These extensions are only active when the Display Conditions feature is enabled via the conditionsEnabled flag in initialization settings.
Learn more: Display Conditions Configuration

How it works

• When conditionsEnabled: true is set and the extension is connected, the editor will show either:
  • A sidebar control for setting conditions (example 08), or
  • An action in the context menu of each block (example 09).
• Clicking this control opens your custom modal or dialog, where users can define visibility rules using your own logic, UI, or connected data sources.
• Once confirmed, your extension must return a list of structured conditions via callback.
• These conditions will be saved to the email structure and respected during export, rendering, and preview — just like native conditions.

Benefits

• Full control over the user experience for defining visibility rules.
• Ability to sync or map display conditions from external systems or CRM rules.
• Can be used in combination with Stripo’s native Display Conditions for deeper customization.

Please refer to the following samples to implement this feature:

• Sidebar Integration – External Display Conditions
• Context Menu Integration – External Display Conditions

Both samples show how to open a custom dialog, collect condition data, and return it to Stripo via callback.

Custom Blocks Panel UI

Stripo allows you to customize the appearance and behavior of the Blocks & Modules Panel in the editor using a dedicated Extension. This does not affect which blocks or modules are available — those are still managed by plugin configuration — but it gives you full control over how the panel and its elements look and behave.

How it works

With this extension, you can customize the visual presentation of the panel and individual blocks by configuring:

• Custom titles or hints for blocks and modules
• Tooltip delay timing or disabling tooltips altogether
• Custom icons for specific blocks
• Panel width and layout settings
• Overall spacing, grouping, and styling adjustments for better UX

These modifications are purely UI-level and apply only to how the left panel is rendered in the editor — the structure and logic of blocks remain unchanged.

Benefits

• Align the panel design with your brand or application UX
• Improve usability with custom block descriptions or contextual hints
• Hide distracting UI elements or reduce cognitive load for specific user groups

Please refer to the following sample to implement this feature:

• Blocks Panel Customization Extension

This sample shows how to modify the look and behavior of the blocks panel, including icons, tooltip logic, and layout dimensions.