HTML Editor .NET

Example Usage

The following is an example of dynamic control creation on a Windows form in Visual Studio using C#.

Sample Project Downloads

There are many examples in Visual Basic and C# in the sample applications download available by pressing the 'Download' button on this page or from GitHub.

Getting Started

Moving the cursor to the top of the edited document

htmlEditor.DocumentLoadComplete += HtmlEditor_DocumentLoadComplete;

private void HtmlEditor_DocumentLoadComplete(object sender, EventArgs e)
{
htmlEditor.MoveCursorToElement(this.htmlEditor.Document.Body, Zoople.HTMLEditControl.ELEM_ADJ.ELEM_ADJ_AfterBegin);
htmlEditor.SetFocus();
}

Embedding Images as Base64 data

The following is an example of dynamic control creation on a Windows form in Visual Studio using C#. Simply reference the control in your Visual Studio project and add the following code to form.

This example code shows how to create an email message with inline (embedded images). The images in the editor document are included as Base64 data and the email is saved to a fictional SMTP pickup folder. Of course, the email may be sent using the SMTPClient .NET object

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.IO;
using System.Linq;
using System.Net.Mail;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace Email_Message_Example
{
    public partial class Form1 : Form
    {

        Zoople.HTMLEditControl oEdit;

        public Form1()
        {
            InitializeComponent();

            oEdit = new Zoople.HTMLEditControl
            {
                Dock = DockStyle.Fill,
                DocumentHTML = "<img width=\"200\" align=\"right\" src=\"anna 2.jpg\">",
                ShowPropertyGrid = false,
                CSSText = "BODY {font-family: Arial Unicode MS, Arial, Sans-Serif;}",
                BaseURL = "file:///" + Application.StartupPath + "/images"
            };

            Controls.Add(oEdit);

            oEdit.ToolStripItems.Add("Save As Email").Click += AsEmail_Click;
        }

        private void AsEmail_Click(object sender, EventArgs e)
        {

            string EditorHTML = oEdit.DocumentHTML;

            MailMessage newMail = new MailMessage();
            newMail.To.Add(new MailAddress("you@your.address"));
            newMail.From = (new MailAddress("someone@their.address"));
            newMail.Subject = "Test Subject";
            newMail.IsBodyHtml = true;

            List inlineLogoList = new List();

            foreach (HtmlElement oImage in oEdit.GetItemsByTagName("img"))
            {
                Uri oUri = new Uri(oImage.GetAttribute("src"));
                if (oUri.IsFile)
                {
                    var inlineLogo = new LinkedResource(oUri.LocalPath, "image/" + new FileInfo(oUri.LocalPath).Extension.Substring(1))
                    {
                        ContentId = Guid.NewGuid().ToString()
                    };
                    oImage.SetAttribute("src", "cid:" + inlineLogo.ContentId);
                    inlineLogoList.Add(inlineLogo);
                }
            }

            var view = AlternateView.CreateAlternateViewFromString(oEdit.Document.Body.OuterHtml, null, "text/html");

            foreach (LinkedResource inlineLogo in inlineLogoList)
            {
                view.LinkedResources.Add(inlineLogo);
            }

            newMail.AlternateViews.Add(view);

            var view2 = AlternateView.CreateAlternateViewFromString(oEdit.Document.Body.InnerText, Encoding.ASCII, "text/plain");
            newMail.AlternateViews.Add(view2);

            SmtpClient client = new SmtpClient("mysmtphost");
            client.DeliveryMethod = SmtpDeliveryMethod.SpecifiedPickupDirectory;
            client.PickupDirectoryLocation = Application.StartupPath + "/SMTPPickupFolder";
            client.Send(newMail);

            oEdit.DocumentHTML = EditorHTML;

            MessageBox.Show("Successfully saved to \r\n\r\n " + Application.StartupPath + "/SMTPPickupFolder");

        }
    }
}