FeaturesImages & Media

Protect an image without opening a photo editor

Overlay a logo, a line of text, or both, at render time. Configure it once on the schema and the unmarked original stops being reachable through an image URL.

Standard Included in Standard and Pro

An 1800-pixel pour-over coffee photo with the Larkspur wordmark stamped across its center by ImageWorks at render time, at 70 percent of the image width.
An 1800-pixel pour-over coffee photo with the Larkspur wordmark stamped across its center by ImageWorks at render time, at 70 percent of the image width.

Watermarking in Total CMS is part of ImageWorks, so it happens on the server as an image is rendered rather than in a photo editor before upload. The original file stays clean on disk, the marked version is what gets served, and it is cached like any other transformation.

There are two kinds of mark and they can be used together. An image watermark overlays another file: mark names it, markw and markh size it in pixels or as a percentage such as 15w, markpos places it in one of nine positions, and markpad and markalpha handle the inset and the opacity. A text watermark renders type directly onto the image with marktext, controlled by size, colour, an optional background colour, padding, rotation angle, width and transparency. By default the text spans 40% of the image width, so it carries the same weight on a thumbnail as on the original; marktextw sets another width and marktextsize a fixed size. marktextstroke and marktextshadow add an outline and a drop shadow, sized as a share of the font so they hold at any image size, and keep the text readable on light and dark photos alike. Fonts are TTF or OTF files uploaded to the watermark-fonts depot; the default is Roboto Regular.

A single mark in a corner can be cropped out. Set marktextpos to tile and the text repeats over the whole image in offset rows, at 30° and 30% opacity unless you choose otherwise, with marktextrepeat setting how many marks run across. That is the proofing mark: a client can judge the photo, and no corner is left clean to crop.

Passing those parameters per call is fine for a one-off. Setting them on the schema is what turns a watermark into protection rather than decoration. Put a watermark block in the property's settings and two things change. First, the mark applies even when the URL asks for nothing — a parameter-free image URL normally returns the untouched original, and that shortcut is skipped, so there is no URL that yields a clean file. Second, schema settings are merged after anything in the query string, so a visitor cannot weaken, move or remove the mark by editing the URL.

Marking every derivative is rarely what you want, because a watermark stamped across a 150-pixel thumbnail is just ugly. The limit setting is a pixel threshold: renders below it come back clean, renders above it are marked, and a request with no dimensions at all — the one asking for the original — counts as over the limit rather than under it. Pixel density counts too, so w=600&dpr=3 is an 1800-pixel image and is marked as one.

Watermark settings follow the same three-level override hierarchy as the rest of the image configuration: schema, then collection, then per-object. A stock photography collection can carry a heavier mark than the rest of the site, and one particular image can be handled differently, without a template change anywhere. Replace the logo file under the same name and every image picks up the new mark on its next request.

In practice

What it looks like in a template

twig
{{ cms.media.imagePath('photo', {
	w: 1200,
	mark: 'logo.png',
	markw: '15w',
	markpos: 'bottom-right',
	markpad: 20,
	markalpha: 70
}) }}

A logo watermark at fifteen percent of the image width, inset from the bottom-right corner at seventy percent opacity.

At a glance

What you get

Logo, text, or both
mark overlays an image file; marktext renders type onto the image, in one corner or tiled across all of it. Outlines and shadows keep the text readable on any photo.
Custom fonts
Upload TTF or OTF files to the watermark-fonts depot and name one with marktextfont. Roboto Regular is used when you do not.
No clean original
A schema-level watermark applies even to a URL with no parameters, so the unmarked file is not reachable through an image URL.
URL parameters cannot win
Schema settings are merged after the query string, so editing the URL cannot shrink, move or remove the mark.
A size threshold
limit keeps small renders clean while marking anything large enough to be worth taking. A request with no dimensions counts as large, and so does a high-density one.

Watermarking

Common questions

Can someone remove the watermark by editing the URL?

Not when the watermark is set on the schema. Those settings are merged after the query string, so a URL parameter cannot override them, and a URL with no parameters is watermarked rather than returned untouched.

Do thumbnails get watermarked too?

Only if you want them to. The limit setting is a pixel threshold — renders below it come back clean, and anything above it, including a request with no dimensions, is marked.

Can I use my own font?

Yes. Upload TTF or OTF fonts to the watermark-fonts depot and name one with marktextfont. The default font is Roboto Regular.

Which edition includes watermarking?

Image watermarks and text watermarks are both included in Standard and Pro. A watermark always applies once it is set, even if a license check fails, so a licensing hiccup never serves your images clean.

Can the watermark cover the whole image?

Yes. Set marktextpos to tile and the text repeats over the whole image in offset rows, faint and angled by default, so there is no clean corner to crop. marktextrepeat sets how many marks run across.

Try it on a site of your own.

45 days, every Pro feature, no credit card. Build it, hand it to a client, and see what they can and can’t touch.