How to create custom element

yes, i will do the following :

I will use the news letter plugin https://github.com/artf/grapesjs-preset-newsletter

and i will use ckeditor plugin https://github.com/artf/grapesjs-plugin-ckeditor

and I will add a custom drop down list contains the dynamic fields names in the ckeditor configuration.

Can you give a short example of a mail that uses it so I can better understand what you mean by a "dynamic field"?

For example we have 5 dynamic fields (first name, last name, email,phone, company name) Our user will go to the page to create an email template to be used for example to welcome his clients.

So he will start using the builder to design his email template and while he is doing that he want to drop some of those dynamic fields in hos email template.

For example he will drop text component and write “Dear” and after that he want to drop the dynamic fields (first name , last name)

Thats it, then my application before send this email template to the user clients, will replace those dynamic fields with the real values from database.