Page background
Design an SVG watermark
Choose the watermark content and appearance. The server places the SVG behind the text in every section header.
Document structureHeader-backed placement
The watermark repeats without becoming part of the editable body text.
0 SECTIONS
SVGScalable image
HeaderRepeats per page
Below textBackground layer
The page and margin dimensions are read from each section before its image location is calculated.
Ready to tryUse the controls above to interact with this demo.
What this demonstrates
Use section headers as a repeating background layer
Watermarks belong to the page rather than the document text flow. A section header repeats automatically, while a fixed image placed below the text remains centered behind editable content.
Section headers
Section.HeadersAndFooters
Insert the SVG
HeaderFooter.Images.Add
Background placement
ImageInsertionMode.FixedOnPage | BelowTheText
Center on the page
Image.Location
How it works
The browser saves the current document in Internal Unicode Format and posts it together with the selected watermark settings. The server creates an SVG string, inserts it into the regular header of every section, and reloads the updated document in the editor.
FixedOnPage anchors the image to the page. BelowTheText moves it behind the main document content. The horizontal and vertical locations are calculated independently for each section from its page size, margins, and rendered SVG dimensions.
Each generated image is named tx_svg_watermark_demo. Reapplying or removing the watermark affects only images with that name, preserving other document graphics and header content.
header.Images.Add(
image,
1,
Point.Empty,
ImageInsertionMode.FixedOnPage |
ImageInsertionMode.BelowTheText);
image.Location = new Point(
(availableWidth - image.Size.Width) / 2,
(availableHeight - image.Size.Height) / 2);
Technique adapted from Adding SVG Watermarks to Documents.
NuGet packages
TXTextControl.TextControl.Core.SDK
34.0.4
Provides the core document model and server-side document processing APIs.
dotnet add package TXTextControl.TextControl.Core.SDK --version 34.0.4
Provides the browser-based TX Text Control document editor and JavaScript API.
dotnet add package TXTextControl.Web --version 34.4.0
TXTextControl.Web.DocumentEditor.Backend
34.4.0
Hosts the WebSocket-based backend used by the browser document editor.
dotnet add package TXTextControl.Web.DocumentEditor.Backend --version 34.4.0