The Stripo editor has several versions, the functionality of which differs slightly from each other:

1. letters can be created directly in the Stripo web interface which has the widest and most up-to-date functionality for creating and editing letter templates. Detailed instructions are available at this link.
2. using Stripo plugin in enKod - the plugin created by Stripo does not reflect all current updates of the web version, so if you are missing some complex functionality - you can create a letter in the web version of Stripo and transfer this email in enKod

To create a letter without layout, you can use the Stripo plugin in enKod. You can create a letter in two ways:

• create a letter from scratch in Stripo

To do this, go to Mailings → Message → New Message (Email) In the “Message Editor” step, select “Stripo Editor”.

• Edit one of the ready templates

You may like ready-made enKod message templates, to familiarise yourself with them just click “Select template” and click “Select” on the desired one.

To edit a template in the preview, click the “Open in Stripo Editor” button

Letters in Stripo are assembled from horizontal strips. For each strip you can set the area of the letter:

• Header
• Content
• Footer
• Info area

Why: dividing into areas will expand your customisation possibilities - for each area you can separately set the background colour, text size and colour, their display on mobile devices.

Hover or click on the grey background of the letter canvas in the editor and you will see a strip outline with a “+” button. Click on it and choose one of the strip structures available to you (solid, with dividers into 2, 3, 4 parts).

Click on the grey background of the letter canvas in the editor and you'll see the band outline. In the menu on the left under “Content” you will see a line for “Letter Area”, click on the drop down and select the area you want. Usually:

• header - used for logo, menus
• content - used for the main content of the email: text, media
• footer and info area - to indicate the reason for receiving the email, unsubscribe link, company contact details.

Hover over the grey background of the letter canvas and you will see the band stroke. Hover over and click on the button with an ellipsis - there is a list of available actions on the strip:

• deleting a strip - please note that it is impossible to delete the only strip in the letter
• copy - clicking on it will create a copy of the strip
• moving - by clicking the icon with the left mouse button you can drag the strip to the desired place in the e-mail.
• save stripe as a module - using this button you can temporarily save the design of the stripe you need to reuse it later in your e-mail.

To add text, image, button, etc. to an email, click:

• on one of the image/text/button icons inside the “Drop content here” block
• in the left side menu under “Content” → “Blocks” select the necessary one and drag it to the “Drop content here” block in the necessary area of the email

In the left side menu, go to the “Design” section. There you can set the main parameters of the email:

• General settings - you can set:
  • fixed email width - optimal size is 600 px
  • letter background - colour or image
  • font, text alignment
  • adaptability
  • letter indents
• Stripes - you can set background colour, content colour, text/links colour and size for:
  • header
  • content
  • footer
  • info area
• Headers - default font for the whole email and the size of each level of text headers.
• Button - button colour, hover (hover highlighting), borders, indentation, stroke, rounding, font and size.
• Adaptability - set text sizes in different areas of the email for displaying on mobile devices, header sizes, indents (around the email, relative to the above and below structure bars).

It is important to distinguish between:

• letter background - applies to the entire space of the email. If the message is opened on a desktop device, the background takes up the entire area of the email (for example, in the screenshot below, the background of the email is blue), whereas on mobile screens it is hidden.
• content background - the colour inside the email, which is applied to all containers with product cards, contact information, etc. (in the screenshot below, the content background is white)

To set the background of the email:

• in the left side menu in the “Design” section, scroll down to the “Email background colour” line
• specify the desired colour code or select it manually using the colour palette provided

To set the background of a specific zone:

• for all strips single area: in the left menu under “Design” → “Strips” select the desired area (header, footer, etc.) of the strip and change the colour in the “Content background colour” section

• for specific strip: click on the desired strip (behind the content area within the desired strip). The “Appearance” window will appear in the left menu under “Content”. In the “Content background colour” line, you can set the colour you want for the specifically selected strip.

Please note: if you change the colour for a specific bar, it will not change when you update the colour of all bars in the same area.

Click on the desired strip outside the content area of that strip. In the left menu under. “Content” → “Appearance”. set the desired background for a particular strip in the “Strip background colour” section.

You can also upload a picture as the strip background in the “Picture in background” line

Please note: if you manually change the background colour of one strip, then changing the background of the whole letter or changing the background of another strip of the same area will have no effect on the selected colour of the first strip - it will have to be changed manually (to the desired colour or to “transparent”).

Inside each strip, there are content rows and an outer area. Each of the content rows is called a structure, it can also be given a background colour or picture. To do this:

• click on the required structure line (the block with the name “Structure” should light up)
• in the left side menu under “Content” → “Appearance” set “Structure background colour” or “Background picture”

One structure line can contain several containers with any of the available blocks: text, picture, button, etc.

• for entire container: click on the border of the required block, it should be highlighted with the word “Container”. In the left side menu under “Content” → “Appearance” add “Container background colour” or “Picture in background”

• for specific block container: there can be several blocks in one container (several texts, buttons, etc.), for each of which you can set a different background. Click on the desired block. In the left side menu under “Content” → “Blocks” in the line “Background colour” set the colour you need.

Please note: You cannot set the background colour of a container block if it is a block: picture, video or banner.

In Stripo, text can be:

• plain
• N-level header

Depending on the type of text (plain or header) and its location (inside the strip, button, etc.), you can customise:

• font
• size
• colour
• selection method (italic, bold, underline, marker, etc.).

In the left side menu go to the “Layout” → “General settings” section:

• using the “Alignment” line you can choose the best way to arrange the text for you
• the “Font” line will set the default font for the plain text of the whole letter (it does not overwrite the fonts selected for the letter areas and other blocks)
• using “Interval” and “Paragraph” you can adjust the spacing between lines of text within blocks

In the section “Headings” for level 1, 2 and 3 you can set your unique:

• fonts
• spacing
• underlines
• colour
• indents

In the left side menu, go to “Appearance” → “Adaptivity”:

• for each area (header, content, footer, info area) and email button you can set your:
  • plain text sizes
  • indents
• set the sizes of three levels of headers

In the left side menu under “Design” → “Bars” select the area you need (header, content, footer, info area) and configure:

• text size
• text colour
• link colour
• text indents and paragraphs

Highlight the text block you want in the container, in the left side menu under “Content” → “Blocks”, for the whole block you can set:

• text colour
• alignment (separately for desktop and mobile versions)
• spacing

You can also customise some of the selected text using the quick menu at the top of the editor:

• change font, size, colour, highlights
• change the alignment, indentation of the whole block
• add a link to the text
• add dynamic personalisation content
• add emoji
• create tables

In order to add an image to an email:

• pre-create a location for the picture:
  • new strip with the required structure
  • a new structure, for this purpose in the left side menu in the “Content” → “Structures” section select the structure you need, right-click on it and move it to the necessary place of the email.
• in the left side menu in the “Content” → “Blocks” section, right-click the “Picture” block and move it to the necessary place in the email (for example, to the necessary “Drop content here” block).

• Click on the picture container. In the left side menu under “Content” → “Blocks” you can upload the picture in two ways:

1. upload the picture directly from your computer - by transferring it from the local folder to the block “Drop pictures here” or by clicking on this block and loading selected pictures from the folder. In this case the media (.png, .jpg, .gif, etc.) will be saved in Stripo storage and the address of the picture will be automatically generated.

   The Stripo repository is sometimes out of order and may not display the added media in the email, so we recommend that you save the images you need to the Image Storage, and in Stripo insert the links according to the second method described below.

2. insert a link to the address where the required picture is stored - in the “Link to external resource” field insert the address of the picture and click the checkbox.

After uploading the picture you can customise everything you need:

• alternative text - it is recommended to fill it in, it is displayed in cases when the media cannot be downloaded
• link - click on the image in the email to switch to it.
• image alignment and size
• adaptability - affects the display of the image on mobile devices
• indentation - can be set separately for desktop and mobile versions.

Images uploaded to Stripo can be edit: crop, transform, add frames and simple shapes.

• select the text you want
• in the top menu click the “Make link” button
• in the left side menu in the “Content” → “Blocks” section all necessary settings will appear, with which you can set:
  • link colour
  • enable/disable link underlining
  • link address

By default, a website is expected in the link address, but you can also substitute:

• mail
• telephone
• file
• etc. from the list of possible

• If you need to remove a link, just select it in the text and click the “Make link” button in the top menu.

• click on the required image
• in the left side menu in the “Content” → “Blocks” section, the image settings will appear. In the “Link” line add the address to which the image from the email should be clicked on

To correctly add an unsubscribe link in the Stripo plugin:

• make the text “unsubscribe” a link (via text selection or as a button/menu item)
• in the left side menu in the “Content” section find the “Link” line
• in the drop-down list under “Special Links” select “Unsubscribe”

Anchor link is a link to a section within the email itself.

How to create an anchor link:

• click on block of the email you want to link to
• in the left side menu in the “Content” → “Blocks” section, scroll to the “Anchor link” line and click on the switch.
• in the “Anchor name” line that appears, enter the name:
  • without spaces
  • only Latin letters and numbers are allowed

How to add a link to the created anchor:

• highlight the text you want or click on the image
• in the “Content” section find the “Link” line. In the drop-down list you should see the “Anchor Links” section, click on the name of the anchor you want to add

• in the “Content” → “Blocks” section, find the “Button” block and insert it into the desired area of your email.

• click on the button block. The button settings will appear in the left side menu in the “Content” → “Blocks” section.
• in the “Links” line, insert the URL to which the button will be clicked on.
• enter “Button Text”
• set the text style - font, type and size
• set the colour of the button and button text

• if required - apply hover effect, lines “Button/text colour on hover” (for these lines to appear in the left side menu in the “Design” → “Button” section, the “Highlight on hover” function must be enabled).

In this screenshot:

• “Button colour” - the main colour,
• “Button hover colour” refers to the colour that users will see when hovering over the button,
• “Text colour” refers to the font.

If you don't want the hover effect in your emails, just apply the same colour you set as the main colour or disable the “Highlight on hover” function in the left side menu under “Appearance” → “Button”.

In the button settings you can also:

• set rounding if you like oval buttons
• set alignment
• set button borders

• set hover stroke
• set outer indents
• set internal indents - responsible for the indents inside the button. It doesn't matter where exactly the recipients click - the internal indentation is also clickable, and in doing so makes the buttons more attractive and understandable

To add a menu, you need to:

• in the left side menu in the “Content” → “Blocks” section, find the “Menu” block and drag it to the desired location in the email
• click on the menu block in the email editor
• in the left side menu under “Content” → “Blocks” you will see all the settings you need:
  • you can choose the menu type: links (clickable text only), icons (clickable images only), icons and links (clickable images with captions)
  • if adaptive menu is enabled, all menu items on mobile devices will be shown in a list (under each other). If you don't enable adaptive, the menu items will be displayed in a row. To check the display, use the preview on mobile devices in enKod's “Post Wizard”. For ease of customisation, we recommend using an icon-type menu. In this case, each image for the menu should be pre-calibrated in an editor (e.g. Figma) and made to the same height.
  • you can also set the text style, size, alignment, indentation, etc.
  • add links and images for icons

With the Stripo plugin in enKod you can add simple tables to your text. To do this:

• click on the block with the text to which you want to add a table
• click on “…” in the top menu and select “Table”.
• specify the table size, number of rows and columns, headings, indents and borders.

In such a table you can change the text colour, background colour (if the table occupies one container and you set the background of the container). It perfectly adapts to the mobile device.

For more complex designs you can try to create a table through “Structures”, but it will be difficult to perfectly align the texts in the columns and for each specific case you need to test the display on mobile. The essence of the method:

• in the left side menu under “Content” → “Structures” select the structure you need by number of columns
  • If there are not enough columns, you can add the required number of columns yourself. To do this, click on the structure - in the left side menu in the “Content” → “Structures” section you will see the settings for the number of columns, add the necessary ones and adjust the width of each column. If you need to divide the size equally between all the columns, click on “=”.
• add text to each block in the structure
• to simulate column and row separators, you can add a stroke to each of the text containers.
• to add a new row to the table, it will be enough to copy an existing structure bar.

To customise the display of email elements on mobile devices:

• go to the “Design” → “Adaptivity” section
• set parameters for the size of headers, button text and content in different containers
• it is recommended to enable the “Full Width Buttons” feature so that the customer will definitely notice your call to action.
• for media: in the editor, click on the desired image. In the left side menu under “Content” → “Blocks” settings will appear:
  • adaptive image - if active, the option allows the image to adjust to the screen width of the mobile device (only works on devices that support adaptivity). Be careful with adaptive logos, if you enable this option on them they will stretch to the full width of the mobile screen, which can severely distort the image.
  • indents for mobile - in the indentation bar, click the mobile icon to adjust the indentation of content relative to the background for mobile devices only.

To transfer an email collected in the Stripo web version to enKod and avoid artefacts or content display issues follow the simple instructions:

• in the web version of Stripo, open the HTML panel using the button at the top of the screen
• in the HTML panel, open the CSS section

• create an email in enKod and select Stripo editor
• in the editor open the HTML panel using the button at the top of the screen
• in the HTML panel open the CSS section

• transfer the HTML content (left side of the panel) from Stripo to the appropriate place in enKod
• transfer the CSS content (right side of the panel) from Stripo to the appropriate place in enKod

• Modules in Stripo are searched by name, but only if the names have been written in English.