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 SubBaseUrl 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 = TrueEvery 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 = TrueEnable 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 = Truehref="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 = TrueA 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.
| Option | Before | After |
|---|---|---|
BaseUrl | (unset -- no anchor) | Anchors relative resolution; does not rewrite URLs by itself |
ConvertAbsoluteUrlsToRelativeUrls | src="C:\Articles\my-article\images\step-1.png" | src="step-1.png" |
ConvertFileUrlsToLocalPaths | src="file:///C:/Articles/.../step-1.png" | Recognized as inside BaseUrl, then rewritten same as above |
UrlEncodeHyperlinkHRefs | href="My Page (v2).html" | href="My%20Page%20%28v2%29.html" |