Emitting relative URLs from the editor

The WinForms HTML Editor lets users drop images and links straight into a document, and by default it records wherever those files actually live on disk - an absolute path such as C:\Articles\screenshots\step-1.png. That is fine while you are editing locally, but the moment you publish the same HTML to a CDN, a help site, or a customer's inbox, those hardcoded paths break because the target machine has no such folder. Four properties on the editor control how it emits and rewrites URLs so the HTML you save is portable instead of tied to your machine. This page walks through each one and shows the full setup you would use before handing a document off to a deploy script.

BaseUrl: tell the editor where the document lives

Without BaseUrl, the editor has no anchor for "relative". Set it to the document's working folder, typically at form load:

private void Form1_Load(object sender, EventArgs e) {     // Each article has its own working folder; screenshots live alongside the .htm file.     htmlEditor1.BaseUrl = Path.Combine(currentArticle.WorkingDir, "images"); }

Private Sub Form1_Load(sender As Object, e As EventArgs)     ' Each article has its own working folder; screenshots live alongside the .htm file.     htmlEditor1.BaseUrl = Path.Combine(currentArticle.WorkingDir, "images") End Sub

BaseUrl only sets the anchor: images render correctly in the editor, but saved HTML stays absolute until URL rewriting (below) is enabled too.

C:\Articles\my-article\ +-- article.htm +-- images\     +-- step-1.png     +-- step-2.png     +-- step-3.png  BaseUrl = C:\Articles\my-article\images

ConvertAbsoluteUrlsToRelativeUrls: emit relative paths

Enable relative-path rewriting:

htmlEditor1.Options.ConvertAbsoluteUrlsToRelativeUrls = true;

htmlEditor1.Options.ConvertAbsoluteUrlsToRelativeUrls = True

Every img src, a href, and similar URL attribute inside the BaseUrl tree is rewritten relative to it in DocumentHtml: C:\Articles\my-article\images\step-1.png becomes src="step-1.png". URLs outside the tree stay absolute, since climbing out with ../../../ is rarely useful.

ConvertFileUrlsToLocalPaths: strip file:// scheme

Pasted images sometimes arrive as file:///C:/Articles/.../foo.png because the editor's browser engine can return that form even for a plain Windows path. Strip the file:// scheme so the rewriter recognizes them as inside BaseUrl:

htmlEditor1.Options.ConvertFileUrlsToLocalPaths = true;

htmlEditor1.Options.ConvertFileUrlsToLocalPaths = True

Enable both together; ConvertFileUrlsToLocalPaths only matters alongside ConvertAbsoluteUrlsToRelativeUrls.

Before: file:///C:/Articles/screenshots/step-1.png After:  step-1.png

UrlEncodeHyperlinkHRefs: portable hyperlinks

Pasted reference URLs (Wikipedia, RFCs, SharePoint, etc.) often contain spaces, parentheses, or accented characters that break some feed readers and email clients. Encode hyperlink targets:

htmlEditor1.Options.UrlEncodeHyperlinkHRefs = true;

htmlEditor1.Options.UrlEncodeHyperlinkHRefs = True

href="https://example.com/My Page (v2).html" serializes as href="https://example.com/My%20Page%20%28v2%29.html". Only the href attribute is encoded; the visible link text is untouched.

The full setup

Combine all four settings once, typically at form load:

htmlEditor1.BaseUrl = Path.Combine(currentArticle.WorkingDir, "images"); htmlEditor1.Options.ConvertAbsoluteUrlsToRelativeUrls = true; htmlEditor1.Options.ConvertFileUrlsToLocalPaths = true; htmlEditor1.Options.UrlEncodeHyperlinkHRefs = true;

htmlEditor1.BaseUrl = Path.Combine(currentArticle.WorkingDir, "images") htmlEditor1.Options.ConvertAbsoluteUrlsToRelativeUrls = True htmlEditor1.Options.ConvertFileUrlsToLocalPaths = True htmlEditor1.Options.UrlEncodeHyperlinkHRefs = True

A deploy script can then upload the document HTML and its images/ folder together to a CDN. Served from a URL such as https://cdn.example.com/articles/<slug>/, the relative src attributes resolve correctly with no server-side rewriting.

Ask your AI to do this

Using the SpiceLogic WinForms HTML Editor already referenced in my project, set BaseUrl to the document's working images folder, for example C:\Articles\my-article\images, and turn on Options.ConvertAbsoluteUrlsToRelativeUrls so every img src and href inside that folder tree gets rewritten to a relative path before I save or publish the document. Also enable Options.ConvertFileUrlsToLocalPaths so pasted images arriving as a file:// path still get recognized as local, and turn on Options.UrlEncodeHyperlinkHRefs so pasted reference links containing spaces or parentheses stay portable across email clients and feed readers. Look up the exact property names and their default values with the SpiceLogic MCP tools before writing any code.