Rich-Text Email Editor (TinyMCE)
Every reminder message body is edited through a full rich-text editor powered by TinyMCE, so you can format text, add links, and insert template variables without touching raw HTML.
Available since v1.0.0
Overview
When you open a reminder message to add or edit it, the Message to send in the email field becomes a visual editing canvas with a formatting toolbar. The editor runs in your browser and saves your content as HTML, which is then merged into the email template wrapper each time a reminder is sent.
The editor is PrestaShop's built-in TinyMCE integration, so it behaves the same way as the product description or CMS page editor you may already use. The exact toolbar and controls depend on your PrestaShop version: PS 1.7 and PS 8 load TinyMCE through PrestaShop's tinySetup() wrapper; PS 1.6 loads TinyMCE 3 directly with its "Advanced" theme and a slightly different toolbar layout.
One important technical detail that affects you: the editor is configured to store content with raw entity encoding. This means curly-brace variable placeholders like {completename} or {totalamount} are saved exactly as you type them — they are not converted to HTML entities — so the module can replace them with real values at send time.
Configuration
The editor is built into the reminder message form — there is no separate setting to enable or disable it. It activates automatically whenever you open the message body field.
- Go to Modules > Module Manager, find Order Payment Reminders Pro, and click Configure.
- Scroll to the Messages section and click Edit next to an existing reminder, or click Add new message.
- The message form opens. The Message to send in the email field loads the TinyMCE editor after the page's JavaScript finishes running — wait for the toolbar to appear before you start typing.
If you see a plain text area instead of a toolbar, the page JavaScript did not finish loading. Reload the page and try again. Make sure no browser extension is blocking scripts from your Back Office domain.
The editor is also present in the setup wizard if you go through the initial guided setup.
Editor settings applied by the module
The module fixes the following TinyMCE settings. You cannot change them from the Back Office:
| Setting | Value | Why it matters |
|---|---|---|
| Element format | html | Content is saved as HTML, not XHTML |
| Entity encoding | raw | Curly-brace placeholders like {completename} are stored verbatim, not HTML-encoded |
| Allow HTML in named anchors | enabled | Required for anchor links inside email HTML |
| Editor selector | autoload_rte | The editor activates only on the message body field, not other text areas on the page |
How It Works
Writing and formatting your message
Type directly into the editor canvas as you would in any word processor. Use the toolbar buttons to apply formatting:
| Toolbar control | What it does |
|---|---|
| B / I / U | Bold, italic, underline |
| Strikethrough | Cross out text |
| Justify buttons | Align left, center, right, or full-width |
| Format / Font / Size | Apply heading levels (H1–H4) or change font size |
| Text / background color | Change text color or highlight |
| Bullet / numbered list | Create unordered or ordered lists |
| Indent / Outdent | Shift list items or paragraphs |
| Undo / Redo | Step back or forward through your changes (Ctrl+Z / Ctrl+Y) |
| Full screen | Expand the editor to fill the browser window — useful for long messages |
Keyboard shortcuts work inside the canvas: Ctrl+B for bold, Ctrl+I for italic, Ctrl+K for insert link.
Inserting template variables
Template variables are plain text placeholders — you type them directly into the canvas and the module replaces them with real values when sending each email.
- Position the cursor where you want the variable to appear.
- Type the variable name surrounded by curly braces, for example
{completename}or{totalamount}. - The placeholder appears as literal text in the editor canvas. That is correct — it will not preview as a real value here.
A collapsible Available Variables reference list appears below the editor. Click the heading to expand it and see all variable names with their descriptions. For the complete list see Email Template Variables.
Variable names are case-sensitive.
{totalamount}works;{TotalAmount}does not. Always copy the variable name exactly as shown in the reference list.
Inserting a link
- Select the text you want to turn into a link.
- Click the Insert/Edit link button (chain icon) in the toolbar.
- Enter the full URL in the dialog, for example
https://yourstore.com/order. - Set Target to Open in new window if you want the link to open in a new tab.
- Click Insert to confirm.
To remove a link, place your cursor inside it and click the Remove link button (broken chain icon).
Switching to HTML source view
- Click the Source code button (
< >or HTML on older PS versions) in the toolbar. - The canvas switches to a raw HTML text area.
- Make your edits directly in HTML.
- Click the same button again (or Update, depending on your PS version) to return to the visual canvas.
Use source view to paste a pre-built HTML block, remove unwanted <span> or <font> tags left over from a paste, or verify that a variable placeholder is spelled correctly.
Pasting content from Word or Google Docs
Pasting rich text directly often carries hidden CSS or Microsoft Office markup that breaks email rendering. Use the Paste as plain text button (clipboard with a "T") before pasting:
- Click Paste as plain text so the button is active/highlighted.
- Paste (
Ctrl+V/Cmd+V). The editor strips all external formatting. - Re-apply the formatting you need using the toolbar.
Alternatively, paste normally and then select all text and click Remove formatting (eraser icon) to strip inline styles.
Adding images
The editor includes an Insert/Edit image button, but reminder emails are HTML emails sent from your server. For images to appear in recipients' inboxes, they must be hosted at a publicly accessible URL.
- Host your image on your store's media server, a CDN, or a public image hosting service.
- Click the Insert/Edit image button in the toolbar.
- Paste the full public URL (starting with
https://) into the Source field. - Add descriptive Alt text for email clients that block images.
- Click Save.
Do not paste base64-encoded images. Most email clients strip them or flag the email as spam. Use hosted URLs only.
The module's pre-built email templates use {shop_logo} — a variable replaced with your store logo URL at send time — rather than a hard-coded image path. Using {shop_logo} in your header is the recommended approach.
How the editor content is saved
When you click Save on the message form, the editor's HTML output is stored in the database. The module then inserts this HTML into the email template wrapper (the file containing {wr_title} and {wr_message}) each time a matching reminder is sent. Empty <p></p> tags that TinyMCE sometimes adds are automatically stripped before saving.
Usage Examples
Example: Adding a payment deadline reminder with bold emphasis
You want to remind customers that their order will be cancelled in 3 days. In the editor canvas, write your message, then select the phrase "3 days" and click B in the toolbar. The text is saved as <strong>3 days</strong> and renders bold in recipients' email clients. Add {daysleft} instead of the literal number so the value is always accurate per order.
Example: Building a structured payment instructions list
You want to include bank transfer steps in the email. Type each step on a new line, select all of them, and click the Numbered list button. Then add a hyperlink on "your bank account details" pointing to a page on your store. Switch to source view afterward to confirm the HTML looks clean before saving.
Example: Pasting a pre-designed HTML template
You have built an HTML email block in an external tool. Open the editor, click the Source code button, select all existing HTML, and paste your block. Click the source button again to return to visual mode and check the layout. Insert {completename} and {totalamount} at the appropriate points, then save.
Important Notes
- The editor is language-aware. If your store has multiple active languages, the message form shows a language tab for each one. The editor activates for the currently selected language tab — switch between tabs and edit each language independently.
- Applying a pre-built email template from the template picker replaces the entire message body, including any custom formatting you have already added. Always choose your template first, then apply formatting and variable edits.
- The subject line field is a plain text input — TinyMCE does not apply to it. Do not paste HTML into the subject field.
- PrestaShop's TinyMCE configuration applies a content security filter. Inline
<script>blocks and<style>sections in the<head>will be stripped on save. Use inlinestyle=""attributes on individual elements instead. - The module targets PS 1.5+ and PS 1.6+. PS 1.6 uses TinyMCE 3 with a slightly different toolbar layout (more buttons on row 2, no drag-resize handle in older builds).
- Multi-shop: message content is stored per shop. The editor works the same way regardless of which shop context you are in.
Troubleshooting
| Problem | Solution |
|---|---|
| Editor shows as a plain text area instead of a toolbar | The page JavaScript did not load completely. Reload the page. If it persists, check your browser console for errors and confirm no browser extension is blocking scripts from your Back Office domain. |
| Content saves but the email shows raw HTML tags | Your HTML may have ended up in the subject field, which is plain text. Confirm the formatted content is in the Message to send in the email field, not the subject. |
Variable placeholder like {completename} appears as literal text in received emails | The placeholder is misspelled. Switch to HTML source view and compare the placeholder character by character with the reference list below the editor. Check for extra spaces, wrong capitalisation, or missing curly braces. |
| Pasted content looks broken in received emails | External CSS or Office markup was included in the paste. Switch to source view and remove style= attributes, or re-paste using Paste as plain text. |
| Images do not appear for email recipients | The image URL is not publicly accessible. Open the URL in an incognito browser window to verify. Replace relative paths (/img/...) with full absolute URLs (https://yourstore.com/img/...). |
| Editor does not appear in the setup wizard | The wizard step initialises TinyMCE after its animation completes. If the editor is still missing after the step loads, scroll down and click elsewhere on the page — the editor may need a moment on slower connections. |
| After saving, re-opening the form shows old content | You may have navigated away before the save confirmation appeared. Check the Messages list to confirm which version was saved. Content is only updated when you click Save and see the confirmation banner. |
Frequently Asked Questions
Can I write a plain-text email with no formatting?
Yes. Type directly into the editor canvas without using any toolbar buttons and the module saves your text as simple <p> tags. Most email clients render that as plain-looking text. There is no separate plain-text part to configure — the module sends a single HTML email.
Will my formatting be lost if I apply one of the pre-built email templates?
Yes. Applying a pre-built template from the template picker replaces the entire message body. Choose your template first, then add your formatting and variable edits — not the other way around.
Can I use HTML tables for layout?
Yes. Switch to source view and paste your table markup directly. The editor preserves standard <table>, <tr>, <td>, and inline style="" attributes. Avoid CSS class names that reference your store theme — those selectors will not exist in recipients' email clients.
Why do curly-brace variables like {completename} work even though HTML normally escapes curly braces?
The module configures the editor with entity_encoding: "raw", which tells TinyMCE to store curly braces and other characters verbatim instead of converting them to HTML entities. This is applied automatically — you do not need to do anything special.
Do I need to enter a separate message for each language?
Yes. The message body is translatable. If your store has multiple active languages, the form shows a language tab for each one. Switch between tabs and edit the message independently for each language. The editor is active for whichever tab you are currently viewing.
What happens if I save with an empty message body?
The module saves an empty body. When the cron runs, the email will be sent with no visible body content — only the email template wrapper and subject line will appear. Always enter message content before activating a reminder.