In the first step, you should define 2 containers: one for the Stripo settings panel (where controls will be located) and the other one for the Stripo preview area (the area where the email template you will be working with will be displayed).
<div id="stripoSettingsContainer"></div>
<div id="stripoPreviewContainer"></div>
From the perspective of UI, it is just a 2-div area (Settings Panel and Preview Area) and one JS that can be configured in accordance with your needs to be embedded into these areas.
Important to note: you can independently choose where they should be displayed inside your application and what size to set:
you may set the width of each container according to your preferences;
the height of "stripoPreviewContainer" is, by default, stretched from the place where it was inserted to the bottom of the screen. To set another value, you have to set the inlined max-height style for this container;
the height of "stripoSettingsContainer" is, by default, stretched to the height of the content and limited by the bottom of the screen. To set another value, you have to set the inlined max-height style for this container.
For example, max-height: calc (100vh - 100px), where 100px is the total height of the top and bottom panels. The max-height style must be specified for each panel separately, if not specified, the height will be adjusted by default, from the insertion point to the bottom of the screen.
As a second step, you have to include the script taken from the Application details page in your Stripo plugin account.
The first script leads to the latest plugin version. It means that your plugin will be automatically updated to the latest version whenever we launch a new release.
Following this link, you can follow all releases.
The second script leads to a specific plugin version. You can choose the desired version on this page.
If you want to host Stripo Plugin assets on your end, you can download them from the Stripo Github repo: https://github.com/ardas/stripo-plugin.
Done. You are ready for Plugin initialization.
Thank you for taking the time to read our articles. We hope you will find this information helpful.
If you have any additional questions, please email us at support@stripo.email.
We would be glad to talk with you.