The plugin will help you to create ready to use emails for Cannoli, so you don’t have to name any layers or manually create a structure for your email and quickly sync your frames to Cannoli.app

In order to use the plugin, go to this link to download it.

Once installed, open the plugin in a new Figma file, you will see at the top right a button where you can log-in with your Cannoli account. If you don't have one yet, sign-up here (it’s free!), that way you can sync the email designs from the plugin into Cannoli.

Within the plugin there are two ways to create emails: the first is Design mode, you can create layouts with sections in which you can drag basic elements of an email; second, the Library mode that allows you to drag custom components into a frame to create an email, you can also edit these and use them as a quick starting point.

Design

Steps:

1. Name the layout (that name will be reflected in the Cannoli.app, you can change it later if you wish).
2. Add the sections you need and define which ones will occupy 1 or more columns.
3. Drag and drop the elements you need for each section, you can drag:
   • header
   • paragraph
   • button
   • image
4. When you finish detailing each section with its elements, click on create.
5. A layout will be generated with these sections. You can replace with text and image styles. You can edit the spacing as you see fit.

Library

Steps: